JSFiddle - React, Tailwind, and code Playground

HTML

<div><span id="hoverel">Hello <span></span></span></div>

CSS

div {
    position: relative;
    padding: 10px;
}

#hoverel {
    background: green;
}

#hoverel span {
    position: absolute;
    z-index: -1;
    width: 100%;
    height: 100%;
    background: red;
    top: 0;
    left: 0;
}

#hoverel:hover span {
    background: blue;
}