Is there a native jQuery function to switch elements?
I've found an interesting way to solve this using only jQuery:
$("#element1").before($("#element2"));
or
$("#element1").after($("#element2"));
:)
Paulo's right, but I'm not sure why he's cloning the elements concerned. This isn't really necessary and will lose any references or event listeners associated with the elements and their descendants.
Here's a non-cloning version using plain DOM methods (since jQuery doesn't really have any special functions to make this particular operation easier):
function swapNodes(a, b) { var aparent = a.parentNode; var asibling = a.nextSibling === b ? a : a.nextSibling; b.parentNode.insertBefore(a, b); aparent.insertBefore(b, asibling);}
No, there isn't, but you could whip one up:
jQuery.fn.swapWith = function(to) { return this.each(function() { var copy_to = $(to).clone(true); var copy_from = $(this).clone(true); $(to).replaceWith(copy_from); $(this).replaceWith(copy_to); });};
Usage:
$(selector1).swapWith(selector2);
Note this only works if the selectors only match 1 element each, otherwise it could give weird results.