JavaScript get parent element and write holder div for siblings

Seeing as this has to be JavaScript (and not jQuery) and you can only indentify the child1 by id you could do something as crude as this:

var child1 = document.getElementById("child1"),
    parent = child1.parentNode,
    contents = parent.innerHTML ;
    parent.innerHTML = '<div id="holder">' + contents + '</div>';

Hope this helps...


He said no jQuery, this sounds like a homework assignment but:

var el = document.getElementById('child1');
var parent = el.parentNode;
parent.innerHTML = '<div id="holder">' + parent.innerHTML + '</div>';

i wrote a litte-snipped to travel through DOM to find the first matching parentNode.

Hope this helps someone, sometime.

(/¯◡ ‿ ◡)⊃━☆゚. * ・ 。゚,

function getFirstParentMatch(element, selector) {
  if (!element) {return element};
  element.matches(selector) || (element = (element.nodeName.toLowerCase() === 'html' ? false : getFirstParentMatch(element.parentNode, selector)));
  return element;    
}