title: jquery loop with html?
body: <p>I'm trying to loop results from a php script into my jquery friends list. Can't seem to get the list to show anything but undefined, but if I append it to the body it only shows the last of the array. My code is...</p>
  
  <pre><code>$(function() {
  
      $('&lt;div /&gt;').html('&lt;div id="buddies" class="buddies" style="vertical-align:bottom"&gt;&lt;div class="imheader"&gt;&amp;nbsp;Online Favorites&lt;span class="fr"&gt;&lt;a href="#" id="exitlist"&gt;X&lt;/a&gt;&lt;/span&gt;&lt;/div&gt;&lt;div class="imheader2"&gt;&lt;div class="imheaderspan"&gt;&lt;a href="#"&gt;Options&lt;/a&gt;&lt;/div&gt;&lt;/div&gt;&lt;ul class="imwindow"&gt;&lt;div id="myonlinefavs"&gt;' + FL() + '&lt;/div&gt;&lt;/ul&gt;&lt;/div&gt;&lt;div id="chatbar" class="chatbar"&gt;&lt;div id="ims"&gt;&lt;/div&gt;&lt;div class="buddylist" id="buddylist"&gt;&lt;center&gt;&lt;a href="#" id="im-menu" class="im-menu"&gt;Favorites (&lt;strong id="friendsonline"&gt;0&lt;/strong&gt;)&lt;/a&gt;&lt;/center&gt;&lt;/div&gt;&lt;/div&gt;').appendTo('body');
  
  var imRoot = $("#im-menu");
  var buddies = $("#buddies");
  imRoot.click(function(){
      buddies.toggle();
      imRoot.blur();
      return( false );
  });
  $("#exitlist").click(function(){
      buddies.toggle();
      imRoot.blur();
      return( false );
  });
  $(document).click(function( event ){
      if (buddies.is( ":visible" ) &amp;&amp; !$( event.target ).closest( "#buddies" ).size()){
          buddies.hide();
      }
  });
  
      function FL(){
          $.ajax({
              type: 'POST',
              url: 'config/receive_buddylist.php',
              cache: 'false',
              dataType: 'json',
              success: function(data){
                  data &amp;&amp; $.each(data, function(i, e){
                      if (i == "buddylist") {
                          $.each(e, function (l, f) {
                              if(f.id != null){
                                  $('&lt;div /&gt;').html('&lt;li&gt;' + f.n + '&lt;/li&gt;');
                              }
                          });
                      }
                  });
              }
          });
  
      }
  });
  </code></pre>