JSFiddle - React, Tailwind, and code Playground

by Sedbol

HTML

<div class="but">1</div>
<div class="but">2</div>
<div class="but">3</div>
<div class="but">4</div>

CSS

.but{
  display: inline-block;
background: mediumvioletred;
padding: 3px;
width: 18px;
text-align: center;
cursor: pointer;
}

JavaScript

let but=document.querySelectorAll('.but');
    for(let i=0;i<but.length;i++){
        but[i].addEventListener( "click" , (e) => {
            e.path[0].style.background="black";
            e.path[0].style.color="white";
        });
    }