JSFiddle - React, Tailwind, and code Playground

HTML

<div class="block">
    <div class="badge"></div>
</div>

<div class="block">
    <div class="badge"></div>
</div>

<div class="block">
    <div class="badge"></div>
</div>

<div class="block">
    <div class="badge"></div>
</div>

CSS

body {
/*     margin:0; */
    background-color: #333;
}
.block {
    float: left;
    width: 100px;
    height: 100px;
    background-color: #fff;
    margin: 10px;
    cursor: pointer;
}
.block:nth-child(even) { background-color: red; }
.block:nth-child(odd) { background-color: yellow; }

.block:nth-child(2) {
    opacity: 0;
/*     visibility: hidden; */
/*     display: none; */
}

JavaScript

$('.block').on('click', function(){
	alert('Clicked block '+($(this).index()+1));
});