title: How to add an image and increment the images on after each onclick function in jquery
body: <p>I have been trying to dynamically take images from my images folder in my project. With the click function, I need the first image to show in the div, clicking the same button should add a second button, and so forth, on reaching the last image it should start back at the top and continue adding the images until reset is clicked. I need to have a counter that will keep showing the total number of images.</p>
  <p>I'm not able to move past getting the images to show. I've added them in an array to bypass the issue of the various names as renaming them is not an option. Currently, the images do not show up and I get the little icons for missing images and twelve icons at once, not one at a time.</p>
  <p>Below is the jquery code:</p>
  <pre><code>$(document).ready(function(){
  
  $(&quot;#add_cat&quot;).click(function(){
      let images = [];
      images[0] = '&lt;img src=&quot;../images/abyssinian-cat_small.jpg&quot;&gt;';
      images[1] = '&lt;img src=&quot;/images/birman-cat_small.jpg&quot;&gt;';
      images[2] = '&lt;img src=&quot;/images/british-shorhair_small.jpg&quot;&gt;';
      images[3] = '&lt;img src=&quot;/images/maine-coon_small.jpg&quot;&gt;';
      images[4] = '&lt;img src=&quot;/images/persian-cat_small.jpg&quot;&gt;';
      images[5] = '&lt;img src=&quot;/images/ragdoll-cat_small.jpg&quot;&gt;';
      images[6] = '&lt;img src=&quot;/images/russian-blue_small.jpg&quot;&gt;';
      images[7] = '&lt;img src=&quot;/images/savannah-cat_small.jpg&quot;&gt;';
      images[8] = '&lt;img src=&quot;/images/scottish-fold_small.jpg&quot;&gt;';
      images[9] = '&lt;img src=&quot;/images/siamese-cat_small.jpg&quot;&gt;';
      images[10] = '&lt;img src=&quot;/images/singapura-cat_small.jpg&quot;&gt;';
      images[11] = '&lt;img src=&quot;/images/sphynx-cat_small.jpg&quot;&gt;';
  
      for (var i=1; i&lt;=images.length; i++)
      {
          $(&quot;#cats&quot;).prepend('&lt;img src=&quot;images/'+i+'.jpg&quot;&gt;');
      }
  
  })
  </code></pre>
  <p>})</p>