Random style changes on a timer

by bgrins

HTML

<div>random styles</div>

CSS

div {
    border: solid 2px black;
    padding: 10px;
    
}

JavaScript

var el = document.querySelector("div");

var props = ["color", "backgroundColor", "borderColor"];
var vals = ["red", "green", "blue"];

setInterval(function() {
    var random1 = Math.floor(Math.random() * props.length);
    var random2 = Math.floor(Math.random() * vals.length);
    console.log("setting", props[random1], vals[random2]);
    el.style[props[random1]] = vals[random2];
    
}, 1000);