title: How to append DOM Element into an empty element in JavaScript?
body: <p>I have bunch of objects that return a DOM-tree that I then use to append to an element. For example,</p>
  
  <pre><code>var elem = document.createElement('div');
  elem.appendChild(callSomePrototypesMethod());
  elem.appendChild(callSomePrototypesMethod());
  elem.appendChild(callSomePrototypesMethod());
  </code></pre>
  
  <p>and I will eventually end up in something like:</p>
  
  <pre><code>&lt;div&gt;
  &lt;div id="..."&gt;...&lt;/div&gt;
  &lt;div id="..."&gt;...&lt;/div&gt;
  &lt;div id="..."&gt;...&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Those three DIVs were created by third party code, and I am wrapping them around my DIV tag here, but what I want instead is to just append them to an empty element, but it doesn't work:</p>
  
  <pre><code>var elem = document.createElement('');
  elem.appendChild(callSomePrototypesMethod());
  elem.appendChild(callSomePrototypesMethod());
  elem.appendChild(callSomePrototypesMethod());
  </code></pre>
  
  <p>Expected results:</p>
  
  <pre><code>&lt;div id="..."&gt;...&lt;/div&gt;
  &lt;div id="..."&gt;...&lt;/div&gt;
  &lt;div id="..."&gt;...&lt;/div&gt;
  </code></pre>
  
  <p>I'm not sure if this makes any sense to you, but I need to use DOM, and I can't put those content within any other elements...</p>