Muchas veces el valor de $(window).scrollTop() + $(window).height()
puede ser menor en 0.5 al de $(document).height()
por lo que tu condición no se cumplirá, para solucionar esto podríamos agregar un "offset" y de paso aprovechamos para que los elementos empiecen su carga antes que el usuario llegue al final de la página
$(window).scrollTop() + $(window).height() >= $(document).height() - 50
Un consejo, no es recomendable agregar funciones directamente al scroll, de hecho algunos navegadores despliegan un aviso alertando que esto puede afectar el rendimiento.
Te sugiero agregar una bandera que nos indique si se ha hecho scroll y realizar una acción dependiendo del valor de esta:
var didScroll = false;
// Agregamos un listener al scroll para asignar el valor a la bandera
$(window).scroll(function() {
didScroll = true;
});
// Declaramos una función que esté llamando cada cierto tiempo para actualizar el estado dependiendo de la bandera
setInterval(function() {
if (didScroll) {
if ($(window).scrollTop() + $(window).height() >= ($(document).height() - 50)) {
$('body').append('<p>Soy un texto nuevo!</p>');
didScroll = false;
}
}
}, 250);
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<h1>Haz scroll :)</h1>
<p>Soy un texto</p>
<p>Soy un texto</p>
<p>Soy un texto</p>
<p>Soy un texto</p>
<p>Soy un texto</p>
<p>Soy un texto</p>
<p>Soy un texto</p>
<p>Soy un texto</p>
<p>Soy un texto</p>
<p>Soy un texto</p>
<p>Soy un texto</p>
<p>Soy un texto</p>
<p>Soy un texto</p>
<p>Soy un texto</p>
<p>Soy un texto</p>
<p>Soy un texto</p>
<p>Soy un texto</p>
<p>Soy un texto</p>
<p>Soy un texto</p>
<p>Soy un texto</p>
<p>Soy un texto</p>