title: Creating dynamic list view in jquery mobile not working?
body: <p>When trying to create a dynamic listview on the fly i get this</p>
  
  <p><img src="https://i.stack.imgur.com/tT9hZ.png" alt="what i get"></p>
  
  <p>here is my json</p>
  
  <pre><code>{"eventid":["61","23"],"name":["Clare Birthday","Mums Birthday"],"enddate":["Sat 27th April 2013","Wed 19th June 2013"]}
  </code></pre>
  
  <p>and here is my code.</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
                                  $(function(){
                                      var items="";
                                          $.getJSON("ajaxResponder.php?method=check-events",function(data){
                                              $("#contacts").html(
                                              '&lt;li data-role="list-divider" role="heading"&gt;Live Events&lt;/li&gt;'+
                                                  $.each(data,function(index,item){
                                                      '&lt;li&gt;&lt;a href="check-events-details?eventid='+item.eventid+'" data-transition="slide"&gt;'+item.name+ 
                                                      '&lt;p&gt;End Date: '+item.enddate+'&lt;/p&gt;&lt;/li&gt;'
                                                  }));
                                              $("#contacts").listview("refresh");
                                          });
                                  });
  
                          &lt;/script&gt;
  
              &lt;div data-role="fieldcontain"&gt;
              &lt;ul id="contacts" data-role="listview" data-divider-theme="b" data-inset="true"&gt;
              &lt;/ul&gt;
              &lt;/div&gt;
  </code></pre>
  
  <p>can anyone see where i am going wrong?</p>