JSFiddle - React, Tailwind, and code Playground

by Ayadi Baha Eddine

HTML

<div id="item-wrapper0" onClick="module.Choose('0',5);"><a href="#" id="item0">5</a></div>
<div id="item-wrapper1" onClick="module.Choose('1',5);"><a href="#" id="item1">5</a></div>
<div id="item-wrapper2" onClick="module.Choose('2',5);"><a href="#" id="item2">5</a></div>
<div id="item-wrapper3" onClick="module.Choose('3',5);"><a href="#" id="item3">5</a></div>
<div id="item-wrapper4" onClick="module.Choose('4',5);"><a href="#" id="item4">5</a></div>

JavaScript

$(document).ready(function() {
    window.module = {
      Choose: function (id, value) {

        for (var i = 0; i < 5; i++) {
            document.getElementById("item-wrapper" + i).style.backgroundColor = "#424242";
            document.getElementById("item-wrapper" + i).style.borderColor = "#000000";
            document.getElementById("item" + i).style.color = "#ffffff";
        }

        document.getElementById("item-wrapper" + id).style.backgroundColor = "#000";
        document.getElementById("item-wrapper" + id).style.borderColor = "#000000";
        document.getElementById("item" + id).style.color = "#ffffff";
      }
   }
});