JavaScript get parent element and write holder div for siblings

Answer 1

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...

Answer 2

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>';

Answer 3

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 : getFirstParent(element.parentNode, selector)));
  return element;    
}