title: JQuery append and Javascript appendChild with document.write in appended Element
body: <p>I am a bit confused about how differently the jQuery append() and the Javascript appendChild() functions handle an Element that calls the document.write() function within. </p>
  
  <p>Here's my HTML Code: </p>
  
  <pre><code>&lt;div id="main-area"&gt;
  &lt;/div&gt;
  
  &lt;div id="temp-area"&gt;
      &lt;div id="content"&gt;
          &lt;script&gt;
              document.write('Lorem Ipsum Dolor...');
          &lt;/script&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I basically want to put the whole Element '#content' and all its Contents, including the 'Lorem Ipsum' Javascript Bit from '#temp-area' to '#main-area'. My first approach was simple jQuery:</p>
  
  <pre><code>target = jQuery('#main-area');
  content = jQuery('#content');
  target.append(content);
  </code></pre>
  
  <p>This works, but with one exception: the 'Lorem Ipsum Dolor' text is written once in the '#content' Element where it belongs, now within the '#main-area' div, AND once beneath both divs at the bottom of the page (without the '#content' div wrapping the text). Of course, I want the text to be shown only once, within the '#content' div. If I write the Lorem Ipsum text as static HTML, the whole thing works just fine, so it's got to have something to do with the document.write function and how this affects the DOM Tree, right? So i experimented a little more and came to this solution:</p>
  
  <pre><code>target = jQuery('#main-area').get(0);
  content = jQuery('#content').get(0);
  target.appendChild(content);
  </code></pre>
  
  <p>With this Code, the Lorem Ipsum Text is only written once in the HTML Document, and exactly where i want it to be. Problem solved.</p>
  
  <p>But i don't get how and why this approach works and the other one doesn't. So I'm not asking for a solution to my problem, but for an explanation as to why both approaches handle things so differently to understand whats going on here. Is there perhaps a wholly different solution to the scenario that I'm missing and that's easier to understand? </p>
  
  <p>(i tested in firefox and opera)</p>
  
  <p>Thanks</p>