Question

I have created a new tag by jQuery, and the code looks like this:

new_compare_item = $("<div/>");
new_compare_item.attr("id", "compare_item");
new_compare_item.attr("name", "compare_item");
new_compare_item.addClass("div_image");
new_compare_item.append($("<img/>")
.addClass("image")
.attr("src", "/compare/sites/default/files/add_item.jpg")
.attr("height", 50)
.attr("width", 50));

new_compare_item.append($("<span/>")
.addClass("remove_item")
.click(function(){
$(this).parent().remove();
}));

There is a click event which again removes the above generated div tag. The code is this:

$(".remove_item").click(function(){
var id = $(this).parent().attr("id");
var remove_item_id = document.getElementById(id);
$("div#"+id).remove();
)};

But, it cannot find the newly created newly created div tag. I have also replaced this with javascript but no use. The thing is it cannot find the id of newly created div tag. How to solve it?

Answer 1

instead of $(".remove_item").click(function(){ /* CODE */} use $(".remove_item").live('click',function(){ /* CODE */} deference between them you can see here jQuery live()