JSFiddle - React, Tailwind, and code Playground

HTML

<div id='addUser'><div id='requestSent' onmouseover="fun();" onmouseout="fun1();" >Add Friend</div></div>
<div id='cancelReq' >hello there</div>

CSS

#cancelReq{display:none;}
#requestSent:hover + #cancelReq{display:block;}

JavaScript

function fun(){
         document.getElementById("cancelReq").style.display = "block";
     }

     function fun1(){
         document.getElementById("cancelReq").style.display = "none";
     }