Jquery Append, Append running twice by it self..? On Select
<p>HTML:</p>

<pre><code>&lt;body&gt; 
&lt;p&gt;&lt;a href="#" class="link" &gt;Apples&lt;/a&gt; &lt;a href="#" class="link" &gt;Berries&lt;/a&gt; &lt;a href="#" class="link"&gt;Carrots&lt;/a&gt;&lt;/p&gt;
&lt;select id="list"&gt;&lt;/select&gt;
&lt;/body&gt; 
</code></pre>

<p>Jquery: </p>

<pre><code>$('.link').click(function(){
    var item = $(this).text();
    $('#list').append('&lt;option&gt;'+item+'&lt;\option&gt;');
});
</code></pre>

<p>It should append new values from the HTML link tags such as apple or carrot but when I click on it it does this (get two lines for each one)</p>

<p><b>Results:</b></p>

<p><img src="http://i.stack.imgur.com/qsx8r.jpg" alt="results"></p>

<p>Evey click results in a two options one with the word the other with a blank. Even more odd it seems to work if I take out the html part of things.. Just use text.</p>
