Why can't I append a cloned element to another parent?
<p>I've got two divs:</p>

<pre><code>&lt;div id='div1'&gt;
  &lt;span&gt;text&lt;/span&gt;
&lt;/div&gt;

&lt;div id='div2'&gt;
&lt;/div&gt;
</code></pre>

<p>I'm trying to move the span from div1 to div2:</p>

<pre><code>  var div1 = document.querySelector('#div1');
  var div2 = document.querySelector('#div2');

  //cloning span
  var span = div1.firstElementChild.cloneNode();
  //removing span from the first div
  div1.removeChild(div1.firstElementChild);
  //trying to append new span to the second div but nothing happens
  div2.appendChild(span);
</code></pre>

<p>The span element is removed but isn't inserted in the second div.</p>

<p>Am I missing something?</p>
