Как удалить <br>
 

При нажатии на + добавляется input и тег <br>, как сделать, чтобы при нажатии на - удалялся последний input и <br>, который после него??

<script type="text/javascript">
$(document).ready(function(){
x=1;
$('.add').click(t = function() {
if (x==10) return false;
var new_input = document.createElement("input");
new_input.setAttribute('type', 'file');
new_input.setAttribute('class', 'foto');
new_input.setAttribute('name', 'photo[]');
new_input.setAttribute('value', '');

$('.del').after(new_input).after('<br>');

x++;
});
$('.del').click(t = function() {
if (x==1) return false;
$('<br>:last').remove();
$('.foto:last').remove();
x--; /////// инкрементируем счетчик полей
});

});
</script>
<input class="foto" style='border:1px solid #1d8cd7;' type='file' name='photo[]' value='' /> <a class='add' href="javascript: void(0)" target='_self'><b>+</b></a> <a class='del' href="javascript: void(0)" target='_self'><b>-</b></a>

А почему бы вместо br'ов не обернуть input в div?
Тогда при удалении дива-обертки удалится и сам инпут и перенос осле него.

а как инпут обернуть в див тогда??? я пытался сделать нечто такое:
$(.foto).after("<div>").after(new_input).after("</div>");

var new_div = document.createElement("div");
new_div.setAttribute('class', 'foto');

$('.foto:last').wrap(new_div).before(new_input);

я вот что написал, но тут получается, что создается инпут в диве, а этот див вкладывается в другой див. Короче получается огромная иерархия дивов

Ну и что?
или типа каждый последующий вкладывается в предыдущий? Значит просто не туда вставляешь.