JSFiddle - React, Tailwind, and code Playground
HTML
<button class="side-button">botão 1</button>
<button class="side-button">botão 2</button>
<div>Div 1</div>
<div>Div 2</div>
CSS
.side-button {
color: blue;
}
.clicked-button {
color: red;
}
JavaScript
var btns = document.querySelectorAll('button');
var show = document.querySelectorAll('div');
for (var i = 0; i < btns.length; i++) {
(function () {
var thisIndex = i;
btns[i].addEventListener('click', function () {
this.classList.remove('side-button');
this.classList.add('clicked-button');
show[thisIndex].style.display = 'initial';
for (var j = 0; j < btns.length; j++) {
if (j != thisIndex) {
btns[j].classList.remove('clicked-button');
btns[j].classList.add('side-button');
show[j].style.display = 'none';
}
}
});
})();
}