understanding effect of jquery statement
<p>I was looking for an easy way to get the contents of a jquery element and came across this page:  <a href="http://jquery-howto.blogspot.com/2009/02/how-to-get-full-html-string-including.html" rel="nofollow">http://jquery-howto.blogspot.com/2009/02/how-to-get-full-html-string-including.html</a></p>

<p>It has the following code</p>

<pre><code>var html = $('&lt;div&gt;').append($('#top').clone()).remove().html();
</code></pre>

<p>Their explanation is as follows:</p>

<blockquote>
  <p>1) Cloning selected div</p>
  
  <p>2) Creating a new div DOM object and appending created clone of the div </p>
  
  <p>3) Then getting the contents of wrapped div (which would give us all HTML) </p>
  
  <p>4) Finally removing the created DOM object, so it does not clutter our DOM tree.</p>
</blockquote>

<p>My question are as follows:
1) it looks like the first thing this does is create a <em>new</em> div that is not attached to the dom, so why does it need to have the "remove" call?
2) I understand why it doesn't come up for this example, but in general is there much difference between doing  </p>

<pre><code>A:  $('&lt;div&gt;').append('&lt;span&gt;foobar&lt;/span&gt;') 
B:  $('&lt;div&gt;&lt;span&gt;foobar&lt;/span&gt;&lt;/div&gt;) 
</code></pre>
