JSFiddle - React, Tailwind, and code Playground

by masteram

HTML

<script src="http://imakewebthings.com/jquery-waypoints/waypoints.js"></script>
<div id="mylist">
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
    hello<br />
</div>
<div id="mywaypoint">mywaypoint</div>

JavaScript

$(function ()
  {
	$('#mywaypoint').waypoint(function (direction)
	{
        if (direction != "down") return;
        for(var i = 0; i < 20; i++)
        {
            $('#mylist').append(i + ' - goodbye<br />');
        }
        $('#mylist').append('------<br />');
        setTimeout(function(){$.waypoints('refresh');},10);
    }, { offset: '100%' });
  });