Unwrap a DOM element

Remove the parents of an element from the DOM, leaving the element's content in place.


How to unwrap an element with cross browser safe DOM methods:

// select element to unwrap
var el = document.querySelector('div');

// get the element's parent node
var parent = el.parentNode;

// move all children out of the element
while (el.firstChild) parent.insertBefore(el.firstChild, el);

// remove the empty element
parent.removeChild(el);

The code is straight forward and much faster than the corresponding jQuery's method $.unwrap().


Feedback