Jquery append() isn't working
<p>I have this <code>&lt;ul&gt;</code></p>

<pre><code>&lt;ul id="select_opts" class="bullet-list" style="margin-left:15px;"&gt;&lt;/ul&gt;
</code></pre>

<p>This javascript code which is meant to go throug a JSON object and add the options 
to the UL:</p>

<pre><code>$.each(q.opts, function(i,o)
{                        
    var str='';
    str+="&lt;li id='li_" + i + "'&gt;&lt;input type='text' id='opt_" + i + "' value='" + o.option + "'&gt;";
    str+=" (&lt;a href='javascript:delOpt(" + i + ");'&gt;Delete&lt;/a&gt;) &lt;/li&gt;";
    $("#select_opts").append(str);

});
</code></pre>

<p>If I do console.log() I can see that the looping is working. If I do:</p>

<pre><code>console.log($("#select_opts").html());
</code></pre>

<p>It shows the HTML being updated as expected. However in the browser window, it shows the 
UL as empty!</p>

<p>What am I doing wrong?</p>
