JSFiddle - React, Tailwind, and code Playground

by David Thomas

HTML

<div id="chromemenu" class="chromestyle">
    <ul>
        <li><a rel="dropmenu1" href="#" class="selected">Buy</a>
        </li>
        <li><a rel="dropmenu2" href="#" class="">Sell</a>
        </li>
        <li><a rel="dropmenu3" href="#" class="">Community</a>
        </li>
        <li><a rel="dropmenu6" href="#" class="">Languages</a>
        </li>
        <li><a rel="dropmenu4" href="#" class="">My Account</a>
        </li>
    </ul>
</div>

CSS

li {
    border-top: 1px solid transparent;
}
.activeParent {
    border-top-color: #000;
}

JavaScript

$('a.selected').closest('li').hover(function(){
    $(this).addClass('activeParent');
},function(){
    $(this).removeClass('activeParent');
});