<html>
<head>
<style>
.foo{
background: red
}
</style>
</head>
<body>
<div id = "out"></div>
<div class="stars">
<div class="star hs1">*</div>
<div class="star hs2">*</div>
<div class="star hs3">*</div>
<div class="star hs4">*</div>
<div class="star hs5">*</div>
<div class="star hs6">*</div>
<div class="star hs7">*</div>
<div class="star hs8">*</div>
<div class="star hs9">*</div>
</div>
<script>
var random = function(){return Math.random() > 0.5 ? true : false}
var changeClass = function(el){
/foo/.test(el.className) ? el.className = el.className.replace(/[ ]*foo/, "") : el.className = el.className + " foo"
}
var block = document.getElementsByClassName("stars")[0].getElementsByClassName("star")
var change = function(el){
random() ? changeClass(el) : null
}
setInterval(function(){
Array.prototype.forEach.call(block, change)
}, 1000)
</script>
</body>
</html>