JSFiddle - React, Tailwind, and code Playground

HTML

<a id="hover" href="#maisoui">adieu</a>

CSS

a#hover {
    font-size: 3em;
    color: silver;
}

a#hover:hover {
    color: gold;
    background: pink;
    border: 1px solid red;
    border-radius: 4px;
}

JavaScript

//creates a new `style` element in the document
var sheet = (function(){
  var style = document.createElement("style");
  // WebKit hack :(
  style.appendChild(document.createTextNode(""));
  // Add the <style> element to the page
  document.head.appendChild(style);
  return style.sheet;
})();

$el = $('a#hover');

//add the actual rules to it
sheet.insertRule(
    "a#hover:hover {" +
        "color:" + $el.css("color") + ";" +
        "background:" + $el.css("background") + ";" +
        "border:" + $el.css("border")  + ";" +
        "border-radius:" + $el.css("border-raidus")  + ";" +
    "}",0
);