JSFiddle - React, Tailwind, and code Playground
HTML
<div id="container">
<div class="block">Test block</div>
<div class="block">Test block</div>
<div class="block">Test block</div>
<div class="block">Test block</div>
</div>
<div id="addMore">Add more blocks</div>
CSS
.block {
border-bottom: 1px solid red;
counter-increment: block;
margin: 20px 0;
position: relative;
}
.block:after {
content: " " counter(block);
}
.block:last-child {
border-bottom: 0;
}
JavaScript
$("#addMore").one("click", function() {
$("#container").append($("#container").html());
$(this).remove();
});