title: using javascript's .insertBefore to insert item as last child
body: <p>I so miss jQuery. I'm working on a project where I need to get my hands dirty with good 'ol plain Javascript again.</p>
  
  <p>I have this scenario:</p>
  
  <pre><code>parent
      child1
      child2
      child3
  </code></pre>
  
  <p>Via javascript, I want to be able to insert a new node before or after any of those children. While javascript has an <code>insertBefore</code>, there is no <code>insertAfter</code>. </p>
  
  <p>Insert before would work fine on the above to insert a node before any one of those:</p>
  
  <pre><code>parent.insertBefore(newNode, child3)
  </code></pre>
  
  <p>But how does one insert a node AFTER child3? I'm using this at the moment:</p>
  
  <pre><code>for (i=0,i&lt;myNodes.length,i++){
      myParent.insertBefore(newNode, myNodes[i+1])
  }
  </code></pre>
  
  <p>That is inserting my newNode before the next sibling node of each of my nodes (meaning it's putting it after each node).</p>
  
  <p>When it gets to the last node, <code>myNodes[i+1]</code> become <code>undefined</code> as I'm now trying to access a array index that doesn't exist.</p>
  
  <p>I'd think that'd error out, but it seems to work fine in that in that situation, my node is indeed inserted after the last node.</p>
  
  <p>But is that proper? I'm testing it now in a few modern browsers with no seemingly ill effects.  Is there a better way?</p>