JSFiddle - React, Tailwind, and code Playground

by jayakrishnancn

HTML

<img src="" alt="">
  <div id="but"> BUTTON </div>
  <img src="loading.gif">

CSS

.test {
  display: none;
}
.test:nth-child(-n + 4) {
  display: block;
}

#but {
  margin-top: 50px;
}

img {
  display: none;
}

.addIcon {
  display: block;
}

.removeBut {
  display: none;
 }

JavaScript

$(document).ready(function() {
    var count = 1;
    $("#but").click(function() {
      $("img").addClass("addIcon");
      $("#but").addClass("removeBut");
      count++;
      $(".test:nth-child(-n + " + 4*count + ")").show();
    });
});