title: IE9, Javascript: Create and append a new element
body: <p>I'm having some serious trouble getting my code to work in IE9, works fine in Chrome &amp; Firefox but I throws some errors. Here are my 2 functions:</p>
  
  <pre><code>function insertHTML(content){
      var body=document.getElementsByTagName('body');
      body[0].appendChild(createElement(content));
   }
  
  function createElement(string){
       var container=document.createElement('div');
       container.innerHTML=string;
       var element=container.firstChild.cloneNode(true);
       return element;
   }
  </code></pre>
  
  <p>I've tried severel methods for this and none seem to work, I'll explain exactly what I need to do...</p>
  
  <p>...I need to create a new element from an html string, the string is sent back from an ajax call so my script will have almost no idea what it contains until it gets it.</p>
  
  <p>I did try using element.innerHTML but this is no good, because if i have one html element (form) on the screen and the user enters data into it, and then when another element is inserted it will wipe all the user-entered data from the first form. I was doing element.innerHTML+=newData;</p>
  
  <p>So basically, I need 2 things:</p>
  
  <p>1) A way to create a new element from an html string.
  2) A way to append the element to the document body.</p>
  
  <p>It all needs to work cross-browser and I'm not allowed to use jQuery, also the new element cannot be contained in a div parent item, it has to have the body as its parent.</p>
  
  <p>Thanks very much for your help,</p>
  
  <p>Richard</p>