JSFiddle - React, Tailwind, and code Playground

by David Thomas

HTML

<p class="test">Testing</p>
<div>No classes here</div>
<ul>
    <li class="test">Something in a 'test' element</li>
</ul>

JavaScript

Object.prototype.classHighlight = function (over, out) {
    var that = this.length ? this : [this];
    function onOver() {
        for (var i = 0, len = that.length; i < len; i++) {
            that[i].style.backgroundColor = over;
        }
    }
    function onOut() {
        for (var i = 0, len = that.length; i < len; i++) {
            that[i].style.backgroundColor = out;
        }
    }
    for (var i = 0, len = that.length; i < len; i++) {
        that[i].onmouseover = onOver;
        that[i].onmouseout = onOut;
    }
};

document.getElementsByClassName('test').classHighlight('#f90', '#fff');