jQuery: how to add <li> in an existing <ul>?
<p>I have code that looks like this:</p>

<pre><code>&lt;div id="header"&gt;
  &lt;ul class="tabs"&gt;
    &lt;li&gt;&lt;a href="/user/view"&gt;&lt;span class="tab"&gt;Profile&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;
    &lt;li&gt;&lt;a href="/user/edit"&gt;&lt;span class="tab"&gt;Edit&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
&lt;/div&gt;
</code></pre>

<p>I'd like to use jQuery to add the following to the list:</p>

<pre><code>&lt;li&gt;&lt;a href="/user/messages"&gt;&lt;span class="tab"&gt;Message Center&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;
</code></pre>

<p>I tried this:</p>

<pre><code>$("#content ul li:last").append("&lt;li&gt;&lt;a href="/user/messages"&gt;&lt;span class="tab"&gt;Message Center&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;");
</code></pre>

<p>But that adds the new li <em>inside</em> the last li (just before the closing tag), not after it.  What's the best way to add this li?</p>
