JSFiddle - React, Tailwind, and code Playground

HTML

<div id='box0'>Box 0</div>
<div id='box1'>Box 1</div>
<div id='box2'>Box 2</div>
<div id='box3'>Box 3</div>
<div id='box4'>Box 4</div>

CSS

div {
    margin: 5px;
    color: grey;
    border: 1px solid red;
    text-align: center;
}

JavaScript

for (var i = 0; i < 10; i++) {
      document.getElementById('box' + i).onclick = function() {
        alert('You clicked on box #' + i);
      };
    }

//      document.getElementById('box' + i).onclick = function(index) {
//        return function() {
//          window.alert('You clicked on box #' + index);
//        }
//      }(i);