If an HTML element has a listener, what happens to the listener after that element is removed from the DOM?

Question

As the title states, If I have a jQuery listener tied to an HTML element, and then delete the HTML element from the DOM using jQuery what happens?

<div id="eventDiv> ... </div>


$('#eventDiv').click(function() {
    // event handling code here
 });

then what happens to the listener when I do

 $('#eventDiv').remove();

Also, what happens if you don't use jQuery and use document.removeChild()?

Answer 1

If you look at the jQuery source, remove() calls a function called cleanData which calls jQuery.event.remove or jQuery.removeEvent (this seems to be an internal function). These methods eventually call unbind() which removes any event listeners for the DOM element that you are deleting.