title: Insert HTML after String / String position
body: <p>I've come up short on an answer for this so hopefully there's someone who can help me. </p>
  
  <p>I'm trying to <em>non-destructively</em> insert HTML before and after a substring or position in text to create new inline elements or wrap existing text. I would just use innerHTML and be done with this already but I would really like to preserve possible event listeners that might be bound to that particular DOMNode. Is there a method or a prototype of a Element that treats textNodes as individual items that would allow me to append HTML after or before it?</p>
  
  <p>The code might operate like this:</p>
  
  <pre><code>var testParagraph = document.getElementById("TestParagraph");
  
  /** 
      text nodes would represent each item 
      that has been seperated by a space, for example 
  **/
  
  testParagraph.insertBefore(document.createElement("span"), testParagraph.textNodes[3])
  </code></pre>
  
  <p>Thanks for your time!</p>