title: Add HTML elements dynamically with JavaScript inside DIV with specific ID
body: <p>Ok, people, I need your help. I've found some code here on Stackoverflow (can't find that link) which generate HTML code dynamically via JS. Here is code:</p>
  
  <pre><code>function create(htmlStr) {
      var frag = document.createDocumentFragment(),
          temp = document.createElement('div');
      temp.innerHTML = htmlStr;
      while (temp.firstChild) {
          frag.appendChild(temp.firstChild);
        }
          return frag;
      }
  
      var fragment = create('&lt;div class="someclass"&gt;&lt;a href="www.example.com"&gt;&lt;p&gt;some text&lt;/p&gt;&lt;/a&gt;&lt;/div&gt;'); 
  
      document.body.insertBefore(fragment, document.body.childNodes[0]);
  </code></pre>
  
  <p>This code works just fine! But the generated code appears on top of page, right below <code>body</code> tag. I would like to generate that code inside empty <code>div</code> with specific <code>id="generate-here"</code>.</p>
  
  <p>So output will be:</p>
  
  <pre><code>&lt;div id="generate-here"&gt;
      &lt;!-- Here is generated content --&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I know that I can't see generated content with "view source". I only need to generate that content just in this particular place with <code>#generate-here</code>. I'm Javascript noob, so if anyone can just rearrange this code that will be perfect. Thanks a lot!</p>
  
  <p>P.S. I know how to do this with Jquery, but I need native and pure JavaScript in this case.</p>