JSFiddle - React, Tailwind, and code Playground
HTML
<div id="changeBackground">
<button data-class="red">
Red
</button>
<button data-class="blue">
blue
</button>
<button data-class="green">
green
</button>
</div>
CSS
.red {
background-color: red;
}
.green {
background-color: green;
}
.blue {
background-color: blue;
}
JavaScript
var el = document.getElementById("changeBackground");
el.addEventListener("click", changeBackground);
function changeBackground(e) {
e.currentTarget.className = e.target.getAttribute('data-class');
}