How can I activate a click event after cloning a div named .popup
, then clicking on a span named #close
that is designed to close .popup
?
Clicking on it currently does nothing. I understand that the div has been created after the page initialises, I just need to know how to bind this to the page so it is recognised when it is clicked upon.
JavaScript:
$('span#close').click(function () {
$('.popup').fadeOut(1000);
});
HTML:
<div class="popup">
<span id="close">Close</span>
<!-- content -->
</div>
Thank you all for your suggestions, the .on()
handler, I could not get this working, no idea why, so I decided to use @faino 's suggestion.
I created the containing div in the html and set its property to display:none
, this div also contained the span#close
which is used to close the pop up.
When an item was cloned, it was appended to that containing div, and when I clicked on the span#close
, it removed the cloned item and set the containing divs property back to display:none
This way, the span#close
is not cloned and does not need the event exposed again.
Again, thanks for all your answers!