[melky]

вся отрисовка действий скрипта находится в объекте настроек.

<style>
.morning { color: #BADA55 }
.day { color: lime }
.night { color: yellow }
.evening { color: #757575 }
</style>
<div class="changeable"> я меняю цвет! это как ёлка, только я как div </div>

<span class="changeable">и я тоже :)</span>

<script>
 // настройки
window['depended class options'] = {
  'onchange': function(time, lastTime){ // тут отображаем класс на указанных элементах
    Array. // всем
      prototype. // элементам
        forEach. // с классом, имеющим "changeable"
          call(document.querySelectorAll("*[class*=changeable]"), 
               function(element){
                 element.classList.add(time); // добавить в класс текущее время
                 if(lastTime){ // и, если есть старое (при запуске старого нет)
                   element.classList.remove(lastTime); // удалить его.
                 }
                });
  },
  'interval': 1e4*60 // интервал проверки - 10 минут
};

(function(d){function e(){var e=f;a:{var b,g=(new Date).getHours(),a;for(b in c)if("string"===typeof c[b]&&(a=b.split("-"),c[b]=[+a[0],+a[1],c[b]]),a=c[b],g>=a[0]&&g<a[1]){f=a[2];break a}f=void 0}d.onchange&&d.onchange.call(void 0,f,e)}var f,c={"6-12":"morning","12-18":"day","18-24":"evening","0-25":"night"};e();d.id=setInterval(e,d.interval)})(window["depended class options"]);
</script>