title: Dynamically add list item to un-ordered list in Jquery Mobile
body: <p>Before anyone points me to similiar questions here on stackoverflow, I have searched for and read and tried all the solutions that have been provided to no avail. By the way I understand it one would have an empty list like so:</p>
  
  <pre><code>&lt;ul data-role='listview' data-theme='b' data-inset='true' id='resultsList'&gt;
     &lt;!-- keep empty for dynamically added items --&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>Then in your javascript/jquery you'll go like this(bearing in mind I get my data from a JSON object):</p>
  
  <pre><code>var resultLength = jsonObject.results.length;
  var listItems = [];
  
  for(var i=0;i&lt;resultLength;i++){
     var firstname = jsonObject.results[i].FN;
     var lastname = jsonObject.results[i].SN;
  
     //Add result to array
     listItems.push("&lt;li&gt;&lt;a href='#'&gt;"+firstname+" "+lastname+"&lt;/a&gt;&lt;/li&gt;");
  }
  
  //Append array to list and refresh
  $('#resultsList').append(listItems.join(' '));
  $('#resultsList').listview('refresh');
  </code></pre>
  
  <p>But... It doesn't work. I'm new to jquery so it might be a real stupid mistake I'm making somewhere. If anyone has an idea of why this isn't working I'd appreciate it! Been struggling with this for 2days now. If any more information is required, please don't hesitate to ask.</p>
  
  <p>Edit - Added JSON as requested</p>
  
  <pre><code>{"results":
  [
   {   "GUID":"F45B0504-376C-4772-81C2-B920E23E1332",
       "I#":"4202265241081",
       "FN":"JOHN",
       "DOB":"1942-02-26",
       "SEX":"M",
       "SN":"KHUNOU",
       "U#":"VH00041750",
       "TYPE":"P"},
  
  {    "GUID":"BB69F24F-424A-4B10-8A48-E94197894855",
       "I#":"3909035071082",
       "FN":"JOHN E",
       "DOB":"1939-09-03",
       "SEX":"M",
       "SN":"RIVETT CARNAC",
       "U#":"VH00156354",
       "TYPE":"P"
  }
  ],
  "ok":"true"}
  </code></pre>