Удалить элементы и содержимое перед элементом

Question

Я пытаюсь удалить элементы и содержимое перед ссылкой внутри div, когда пользователь нажимает кнопку. Каков наилучший способ сделать это?

<div id="dialog" class="window">  

         //will be inserted a <select> element and few text here 
         //but I want to clear them after the user click a button

    <a href="#" class="close">Close it</a>  // I want to keep this <a> link.    

    </div>  

Мой Jquery

$('.model').click(function(e) {  

   $("#dialog").empty();  //I can't use this because <a> will be deleted. Any better ideas?         

});

Спасибо за ответ ...

Answer 1

Просто оберните все эти элементы в div и удалите их

$('#select-wrapper').remove();

или сделай это немного дружелюбнее

$('#select-wrapper').fadeOut(500, function() { $(this).remove(); });

Answer 2

Вы действительно хотите сохранить эту a ссылку, или вы просто хотите, чтобы этот div содержал ссылку, которая впоследствии будет выглядеть так же?

Почему бы просто не перезаписать innerHTML с помощью <a href="#" class="close">Close it</a>?

Я понимаю, что если эта ссылка каким-то образом изменилась за пределами вашего ведома или контроля, вам придется сохранить ее, но если это не так, то двойник сработает.

Answer 3

Вы можете сделать это:

$('.model').click(function(e) {  
  $("#dialog").children(":not(.close)").remove();
});

Это просто удаляет всех детей, использующих .remove() без класса close. Или просто клонируйте и заново добавьте ссылку, используя .clone(), например:

$('.model').click(function(e) {  
  $("#dialog a.close").clone(true).appendTo($("#dialog").empty());
});

Answer 4

попробуйте поместить контент, который вы хотите удалить, в свой собственный div. Тогда будет просто jquery, чтобы скрыть / удалить div при событии click.