title: Create listview inside collapsible/divider dynamically
body: <p>I am trying to develope an application, and I'm using jQuery mobile for the UI. Does anybody know how to add a listview in a collapsible (as category) dynamically using JavaScript? </p>
  
  <h2>HTML:</h2>
  
  <pre><code>&lt;div data-role="content" id="introContent"&gt;
    &lt;p id="introContentNoFeeds" style="display:none"&gt;welcome!
    &lt;/p&gt;
    &lt;ul id="feedList" data-role="listview" data-inset="true" data-split-icon="delete"&gt;
    &lt;/ul&gt;
    &lt;a href="addfeed.html" data-role="button" data-theme="b"&gt;Add Feed&lt;/a&gt;
  &lt;/div&gt;
  </code></pre>
  
  <h2>js:</h2>
  
  <pre><code>function displayFeeds() {
      var feeds = getFeeds();
      if(feeds.length == 0) {
          //in case we had one form before...
          $("#feedList").html("");
          $("#introContentNoFeeds").show();
      } else {
          $("#introContentNoFeeds").hide();
          var s = "";
          for(var i=0; i&lt;feeds.length; i++) {
              s+= "&lt;li&gt;&lt;a href='feed.html?id="+i+"' data-feed='"+i+"'&gt;"+feeds[i].name+"&lt;/a&gt; &lt;a href='' class='deleteFeed' data-feedid='"+i+"'&gt;Delete&lt;/a&gt;&lt;/li&gt;";
          }
          $("#feedList").html(s);
          $("#feedList").listview("refresh");
      }   
  }
  function getFeeds() {
      if(localStorage["feeds"]) {
          return JSON.parse(localStorage["feeds"]);
      } else return [];
  }
  function addFeed(name,url) {
      var feeds = getFeeds();
      feeds.push({name:name,url:url});
      localStorage["feeds"] = JSON.stringify(feeds);
  </code></pre>