title: dynamically create items ons-list-item for a carousel in onsen.ui
body: <p>I need to create a carousel onsen like Example <a href="http://codepen.io/onsen/pen/emmKpV" rel="nofollow">http://codepen.io/onsen/pen/emmKpV</a>, I'm trying to dynamically create items ons-list-item but my code is not working, when dynamically insert a new ons-list-item adding the html code in the ons-list, the new ons-list-item are not displayed, my code is as follows:</p>
  
  <p>here my html code.</p>
  
  <pre><code>&lt;ons-page&gt;
      &lt;ons-toolbar&gt;
          &lt;div class="center"&gt;Simple ng-repeat list&lt;/div&gt;
      &lt;/ons-toolbar&gt;
      &lt;ons-list id='contenedor'&gt;&lt;/ons-list&gt;
      &lt;input type='button' value="item" onclick='crearItem()' /&gt;
   &lt;/ons-page&gt;
  </code></pre>
  
  <p>here my javascript code.</p>
  
  <pre><code>function crearItem(){
      htmlText = "&lt;ons-list-item class='list-item'&gt;&lt;ons-carousel swipeable class='item-container' initial-index='1' auto-scroll&gt;&lt;ons-carousel-item class='list-action-menu' &gt;Borrar&lt;/ons-carousel-item&gt;&lt;ons-carousel-item class='list-action-item'&gt;title&lt;/ons-carousel-item&gt;&lt;/ons-carousel&gt;&lt;/ons-list-item&gt;";  
      document.getElementById('contenedor').innerHTML = htmlText;
  }
  </code></pre>
  
  <p>here my full code
  <a href="http://codepen.io/anon/pen/PPNRzX" rel="nofollow">http://codepen.io/anon/pen/PPNRzX</a></p>
  
  <p>In advance thank you very much to anyone who can help me</p>