How can I remove wrapper (parent element) without removing the child?
Pure JS (ES2015) solution, in my opinion easier to read than jQuery-solutions.
node.replaceWith(...node.childNodes)Node has to be an ElementNode
Pure JS solution that doesn't use innerHTML:
function unwrap(wrapper) { // place childNodes in document fragment var docFrag = document.createDocumentFragment(); while (wrapper.firstChild) { var child = wrapper.removeChild(wrapper.firstChild); docFrag.appendChild(child); } // replace wrapper with document fragment wrapper.parentNode.replaceChild(docFrag, wrapper);}Try it:
unwrap(document.querySelector('.wrapper'));
Surprised that nobody's posting the simplest answer:
// Find your wrapper HTMLElementvar wrapper = document.querySelector('.wrapper');// Replace the whole wrapper with its own contentswrapper.outerHTML = wrapper.innerHTML;