Swap two html elements and preserve event listeners on them

Question

There are similar questions, but all the answers are for swapping html elements only for the content inside.

I need to swap two divs, with lots of content in them (t

Answer 1

This somewhat depends on how your events are bound to the elements you're swapping. If you're using jQuery, then this answer is all you need, really.

The main thing is not to delete or removeChildnode the elements, and just copy-paste the html elsewhere. In doing so, some browsers will clear all resources (event handlers included) so, bound events will be lost. Though IE is notorious for leaking memory when it comes to dynamically bound events. It's hard to predict how various browsers will behave, really.

Basically, I'd say: swap elements in any way you like, except for copy/paste HTML strings, and bind your events using jQuery's .live() method. Since I don't think 1.5 has the .on method