JSFiddle - React, Tailwind, and code Playground

HTML

<div id="showwrap">
    <div id="leftbox">
        <ul>
            <li id="a"> <a href="">One</a></li>
        </ul>
    </div>
    <div id="rightbox">
        <ul>
            <li id="b"> <a href="">Firstname Lastname</a></li>
        </ul>
        <ul>
            <li id="b"> <a href="">Firstname Lastname</a></li>
        </ul>
    </div>
</div>

CSS

.hoverClass a{
    color: #006600;
}

JavaScript

document.getElementById('a').onmouseover=function(){
    document.getElementById('b').className += " hoverClass";
};

document.getElementById('a').onmouseout=function(){
    document.getElementById('b').className -= " hoverClass";
};