JSFiddle - React, Tailwind, and code Playground

HTML

<ul id="myElem" style="background-color: red; height: 400px; width: 400px; overflow: auto">
    <li>foo</li>
</ul>

<p>Near bottom? <span id="readout"></span></p>

JavaScript

$.fn.isNearTheEnd = function() { 
    return this[0].scrollTop + this.height() >= this[0].scrollHeight; 
} 

$("#myElem").scroll(function() {
    
    $("#readout").text($(this).isNearTheEnd() ? "YES" : "NO");
});