JSFiddle - React, Tailwind, and code Playground

HTML

<h1>Привет, всем зрителям LoftBlog !</h1>
		<button data-color="day" id="day">День</button>
		<button data-color="night" id="night">Ночь</button> 
		<a data-color="hello-dos" href="http://www.yandex.ru">Привет DOS!</a>

CSS

#box {
			width: 100px;
			height: 100px;
			background: green;
		}  
 
		.night {
			color: white;
			background-color: black;
		}
 
		.day {
			color: black;
			background-color: white;
		}
 
		.hello-dos {
			color: white;
			background-color: blue;
		}

JavaScript

(function() {
var changeColor = function (e) {   
 	eventsObj.preventDefault(e);
 
 	var elem = eventsObj.getTarget(e),
 		colorData = elem.getAttribute('data-color'); 
 
 	if ( colorData ) {
 
 		if (e.type === 'click') {
 			document.body.className = '';
 
 		} else if (e.type === 'mouseover') { 
 			document.body.className = colorData;
 		}
 	}	 
 };
 
 
 eventsObj.addEvent(document, 'click', changeColor );
 eventsObj.addEvent(document, 'mouseover', changeColor );
 
})();