Как удалить только теги, добавленные с помощью append() в jquery

Question

У меня есть div, который выскочит на мышь, и я вставляю некоторый контент, используя html(). И я хочу, чтобы часть кода оставалась без манипуляций.

<div id="pop_div" ><span>X</span></div> 


$("#team_div > ul img").bind('mouseenter',function(){ 
    $("#pop_div").html('<img src="' + img + '"/>' + content); 
}); 

и onclick Я скрываю div.

$('#pop_div span').click(function(){ 
    $("#pop_div").hide(); 
}); 

Моя проблема, я не могу использовать код, приведенный ниже, потому что JQuery не назначает какое-либо событие для этого тега

$("#pop_div").html('<span>X</span><img src="' + img + '"/>' + content); 

(я не могу использовать livequery плагин)

я ценю ваши комментарии.

Answer 1

Вы вносите код #pop_div, когда вы вставляете код HTML, создаются новые элементы DOM, поэтому событие не привязано.

Элемент span удален из DOM и связанные с ним события больше не работают.

Я думаю, что вам не нужно, чтобы заменить все содержимое этого DIV, можно структурировать DIV так:

<div id="pop_div" > 
    <span>X</span> 
    <img/> 
    <div id="content"></div> 
</div> 

В вашем MouseEnter:

$('#team_div > ul img').bind('mouseenter',function(){ 
    $('#pop_div img').attr('src', img); // set the image source 
    $('#pop_div #content').html(content); // display the content 
}); 

Исходное изображение изменен, а переменная content вставляется в div '#content'.

Ваш обработчик клика останется таким, как сейчас, потому что элемент span не влияет.

Answer 2

CMS является правильным. Дополнительный запуск в jQuery 1.3 можно связать с событием with the live function, которое привяжет событие ко всем текущим и будущим элементам.

$('#team_div > ul img').live('mouseenter',function(){ 
    $('#pop_div img').attr('src', img); // set the image source 
    $('#pop_div #content').html(content); // display the content 
});