javascript - Prepend Div Collection With No ID -

i'm trying prepend first div in collection of divs same class no id in html document javascript. parent doesn't have id.

<div class="shiftslistparent"> <div class="shiftslist2"></div> <div class="shiftslist2"></div> </div> 

i'm looking end result looks like

<div class="shiftslistparent"> <div class="shiftslist2">new div here</div> <div class="shiftslist2"></div> <div class="shiftslist2"></div> </div> 

document.queryselector return first element matching css selector, , can use insertbefore on element's parent:

var div = document.queryselector(".shiftslist2"); var newdiv = document.createelement("div"); newdiv.innerhtml = "new div here"; div.parentnode.insertbefore(newdiv, div); 

live example:

var div = document.queryselector(".shiftslist2");  var newdiv = document.createelement("div");  newdiv.innerhtml = "new div here";  div.parentnode.insertbefore(newdiv, div);

<div class="shiftslistparent">  <div class="shiftslist2">original first</div>  <div class="shiftslist2">original second</div>  </div>