Why do registered events disappear when an element is removed from DOM?
dom, javascript, jquery, jquery-events
Solution
When you remove an element from the DOM using jQuery, all data (including event handlers) held by jQuery on that element will be destroyed. This is done to avoid memory-leaks.
This isn't a feature (or bug) of the DOM API. It's just jQuery.
Problem
This jQuery 1.3.2 code adds an element to the page, registers a "click" event, then removes and reattaches the element: ``` var button = $('<button>Click me!</button>') .click(function(){ alert("Hello") }) .appendTo('body'); $('body').html(''); button.appendTo('body'); ``` The button appears on the page as expected, but clicking on it does nothing. I would like to know why the event handlers were removed from the object. Note: I am aware of solutions such as `jQuery.live()` or `clone(true)` or using `appendTo` without a removal. What I'm looking for is an explanation, not a solution or workaround. EDIT: I suppose this could be an arbitrary and counter-intuitive design decision of the DOM. An explanation like "Because that's the way section X of specification Y wants it to be" would be fine.