title: Jquery append() isn't working
body: <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>