JSFiddle - React, Tailwind, and code Playground

by Derek Leung

HTML

<span id="s">ABC</span>

CSS

span:hover {
    color: green;
    text-decoration: underline;
    text-shadow: 2px 2px 5px #555;
}

JavaScript

HTMLElement.prototype.triggerCSS = function(selector) {
    whole:
    for (var i = 0; i < document.styleSheets.length; i++) {
        for (var j = 0; j < document.styleSheets[i].rules.length; j++) {
            if (document.styleSheets[i].rules[j].selectorText == selector) {
                var style = document.styleSheets[i].cssRules[j].style;
                for (var k = 0; k < style.length; k++) {
                    this.style[toCC(style[k])] = style[toCC(style[k])];
                }
                break whole;
            }

        }
    }

    function toCC(input) {
        return input.toLowerCase().replace(/-(.)/g, function (match, group1) {
            return group1.toUpperCase();
        });
    }
}

document.getElementById("s").triggerCSS("span:hover");