JSFiddle - React, Tailwind, and code Playground

HTML

<div id="site_list"> <a href="#" id="0">Site 0</a>
 <a href="#" id="1"> Site 1</a>
 <a href="#" id="2"> Site 2</a>
 <a href="#" id="3"> Site 3</a>
 <a href="#" id="4"> Site 4</a>
 <a href="#" id="5"> Site 5</a>
 <a href="#" id="6"> Site 6</a>
 <a href="#" id="7">Site 7</a>
 <a href="#" id="8"> Site 8</a>
 <a href="#" id="9"> Site 9</a>
 <a href="#" id="10"> Site 10</a>
 <a href="#" id="5"> Site 11</a>
 <a href="#" id="6"> Site 12</a>
 <a href="#" id="7">Site 13</a>
 <a href="#" id="8"> Site 14</a>
 <a href="#" id="9"> Site 15</a>

</div>
<button id="previous">
    << Previous</button>
        <button id="next">Next >></button>

JavaScript

var current_range = 0;
var per_page = 3;
$('button').on('click', function () {
    if ($(this).is('#next')) {
        if (current_range <= $('#site_list a').length) current_range += per_page;
    } else if($(this).is('#previous')) {
        if (current_range > 0) current_range -= per_page;
    }
    change_view();
});

function change_view() {
    $('#site_list a').hide();
    $($('#site_list a').splice(current_range, per_page)).show();
}
change_view();