JSFiddle - React, Tailwind, and code Playground

HTML

<div>
    <span>
    <a href="">link</a>
    </span>
</div>

CSS

div {
    text-align:center;
}
a {
    display:block;
    padding:7px;
    background:#A13F3E;
    color:#fff;
    width:100px;
    font-weight:bold;
}
a:hover {
    color: #FFE260;
}
a:active {
   color:red
}

JavaScript

var link = document.getElementsByTagName('a')[0];

link.onmouseout = function() {
    this.style.color = "blue";
}

link.onmouseover = function() {
    this.removeAttribute('style');
}