JSFiddle - React, Tailwind, and code Playground

HTML

<p>My text with a <strong class="highlighted">sample highlight</strong>.<p>

CSS

.highlighted {
    background-color: #a2a2a2;
    font-weight: normal;
}

JavaScript

$.cssHooks.backgroundColor = {
    get: function(elem) {
        if (elem.currentStyle)
            var bg = elem.currentStyle["background-color"];
        else if (window.getComputedStyle)
            var bg = document.defaultView.getComputedStyle(elem,
                null).getPropertyValue("background-color");
        if (bg.search("rgb") == -1)
            return bg;
        else {
            bg = bg.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
            function hex(x) {
                return ("0" + parseInt(x).toString(16)).slice(-2);
            }
            return "#" + hex(bg[1]) + hex(bg[2]) + hex(bg[3]);
        }
    }
}

$(function() {
    alert("Your background hex color is: " +
          $(".highlighted").css("backgroundColor") + ".");

    $(".highlighted").css("backgroundColor", "red");

    alert("Your new background hex color is: " +
          $(".highlighted").css("backgroundColor") + ".");
});