JSFiddle - React, Tailwind, and code Playground

HTML

<div id="enter" style="margin: 10px; width: 100px; height: 20px; background-color: grey;">
    mouseenter
</div>
<div id="over" style="margin: 10px; width: 100px; height: 20px; background-color: grey;">
    mouseover
</div>

<div id="log">
</div>

JavaScript

$('#enter').one('mouseenter', function() {
    $('#log').append("one(mouseenter) should only fire once ");
});

$('#over').one('mouseover', function() {
    $('#log').append("one(mouseover) works correctly");
});