title: How can i prepend latest images to the Bootstrap carousel?
body: <p>I have developed a web application. Which mainly consists of Carousel and Table. Where Carousel will display image in bigger size and table displays image thumbnails, till now what i Have been doing is I have made ajax request on document.ready() and I am able to update both carousel and table. But now, I need to update web application as to make ajax request periodically.</p>
  
  <p><strong>My question is how can i prepend the latest images to existed carousel without clearing all items as I need to display latest images first.</strong> </p>
  
  <p>Any suggestions or solutions  will be appreciated.</p>
  
  <p>My code to append the carousel items on ajax request:</p>
  
  <pre><code>for (var i = 0; i &lt; jsonobj.length; i++) {
  
      $(".carousel-indicators").append('&lt;li data-target="#myCarousel" data-slide-to="' + i + '" &gt; &lt;/li&gt;');
  
      $(".carousel-inner").append('&lt;div class="item"&gt; &lt;img src="' + jsonobj[i].img_path + '" alt="Image"&gt; &lt;div class="carousel-caption"&gt; &lt;h3&gt;' + jsonobj[i].img_name + '&lt;/h3&gt; &lt;/div&gt; &lt;/div&gt;');
  }
  </code></pre>