jQuery .appendTo or more general for loop not working as expected
<p>jQuery newbie here. I'm working through R Murphy's jQuery Fundamentals and am on the Manipulation exercises in the <a href="http://jqfundamentals.com/book/index.html#chapter-3" rel="nofollow">jQuery Basics</a> section.</p>

<p>The first question in that section asks you to add five new list items to the end of the unordered list #myList. </p>

<p>My approach was to do the following:</p>

<pre><code>var $newItem = $('&lt;li&gt;New Item&lt;/li&gt;');
var $ul = $('#myList');

for (var i=0;i&lt;5;i++){
    $newItem.appendTo($ul);
};
</code></pre>

<p>However this doesn't work as it only inserts one list item into the list, not 5.</p>

<p>The solution provided by the author is very close to mine, the only difference being she doesn't store the new list item in a variable, but rather uses a literal:</p>

<pre><code>var $ul = $('#myList');
for (i=0; i&lt;5; i++) {
    $('&lt;li&gt;List item ' + i + '&lt;/li&gt;').appendTo($ul);
}
</code></pre>

<p>It seems like my approach should work also so I'm struggling to understand why it doesn't.</p>

<p>Help?</p>

<p>Thanks in advance,
n</p>
