JSFiddle - React, Tailwind, and code Playground

HTML

<div id='content'>
    <div id='a'>
        Hover me
    </div>
</div>

<div id='b'>
    Default message
</div>

<div id='c'>
    Alternate message
</div>

CSS

#b {
    display: block;
    background:orange;
    transition: 0.3s;
}
#c {
    display: none;    
    background:yellow;
    transition: 0.3s;
}

#content:hover~#b{
    display: none;
}

#content:hover~#c{
    display: block;
}