jquery - Adding a close button to a DIV that was appended on .click -


i have been working on jquery code interactive map. i've gotten fantastic user named "kevin gurney" on here, big him. i'm having little issue, , wondering if advise.

basically, when user clicks on point on map, div appended full description of map point. want add closing "x" icon in top right of div, user can close it, seems first click event stopping second click event working.

here some sample of code:

$(".point").live("mouseenter", function() {     //code show description     $(this).append('<div class="mapitem-smalldescription">small description</div>'); });  $(".point").live("mouseleave", function() {     //code show description     $(".mapitem-smalldescription").fadeout("normal", function() {         $(this).remove();     }); }); $(".point").live("click", function() {     //code full description     $(this).append('<div class="mapitem-fulldescription"><div class="close">x</div>full description</div>');  });  $(".close").live("click", function() {     //code close description, dosent work     $(".mapitem-fulldescription").fadeout("normal", function() {         $(this).remove();     }); }); 

click on 1 of squares, hover event seperate. click on x @ top right side , nothing happens!

i think looking event.stoppropagation();

$(".close").live("click", function(event) {     //code close description, dosent work     event.stoppropagation();     $(".mapitem-fulldescription").fadeout("normal", function() {         $(this).remove();     }); }); 

updated fiddle.


Comments

Popular posts from this blog

linux - Mailx and Gmail nss config dir -

c# - Is it possible to remove an existing registration from Autofac container builder? -

php - Mysql PK and FK char(36) vs int(10) -