JSFiddle - React, Tailwind, and code Playground

HTML

<div id="transition"></div><br />
<button onclick="recolortransitiondiv();">Recolor that div!</button>

CSS

#transition {
    background-color: #DA1E1E;
    width: 100px;
    height: 100px;
}
#transition:hover {
    background-color: #ADE1E1 !important;
    transition: .5s background-color;
    -webkit-transition: .5s background-color;
    -moz-transition: .5s background-color;
}

JavaScript

function recolortransitiondiv() {
    $("#transition").css("background-color", "#1EDA1E");
}