JSFiddle - React, Tailwind, and code Playground

by Yuri Andrianov

CSS

.noch {background-color: black;}
.vecher {background-color: blue;}
.utro {background-color: red;}
.den {background-color: green;}

JavaScript

var check = function(){
    var hours = new Date().getHours();

    if (hours < 8) {
        document.body.classList.add('.noch');
        document.body.classList.remove('.vecher');
    }
    elseif(hours < 12 && hours >= 8) {
        document.body.classList.add('.utro');
        document.body.classList.remove('.noch');
    }
    elseif(hours >= 12 && hours < 13) {
        document.body.classList.add('.den');
        document.body.classList.remove('.utro');
    }
    elseif(hours >= 13 && hours <= 20) {
        document.body.classList.add('.vecher');
        document.body.classList.remove('.den');
    }
};
setInterval(check, 60000);
window.onload=check;
check();