JSFiddle - React, Tailwind, and code Playground

HTML

<div class="box"><span>hi</span></div>

CSS

.box{
    width:100px;
    height:100px;
    background-color:red;
}

JavaScript

var go = false;
var t;
$('.box').mouseenter(function(){
    t = setTimeout(function(){
        go = true;
        alert($('span',this).text());
    },1000);
});
$('.box').mouseleave(function(){
    clearTimeout(t);
    if(go){
        alert($('span',this).text());
    }
});