JSFiddle - React, Tailwind, and code Playground
HTML
<button class="changeBg" data-bg="red">Красный</button>
<button class="changeBg" data-bg="blue">Синий</button>
<button class="changeBg" data-bg="yellow">Жёлтый</button>
<button class="changeBg" data-bg="green">Зелёный</button>
<button class="changeBg" data-bg="brown">Коричневый</button>
<div id="background" class="background"></div>
CSS
.background {
width: 300px;
height: 300px;
margin: 100px auto;
border: 1px solid #aaa;
}
JavaScript
var changeBg = document.querySelectorAll('.changeBg');
var background = document.getElementById('background');
for (var i = 0; i < changeBg.length; i++) {
changeBg[i].addEventListener('click', function(event){
event.preventDefault();
var backgroundColor = this.getAttribute('data-bg');
background.style.background = backgroundColor;
}, false);
}