JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.min.css">
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <div id="test" class="container">

        <table>
            <thead>
                <tr>
                    <th>Case#</th>
                    <th>Description</th>
                </tr>
            </thead>
            <tbody data-bind="foreach: items.pagedItems">
                <tr>
                    <td data-bind="text: city"></td>
                    <td data-bind="text: zip"></td>
                     <br> <br> <br> <br> <br>
                </tr>
            </tbody>
            
        </table>

        <ul class="pager">
            <li data-bind="css: {'disabled': !items.prev.enabled()}">
                <a href="#" data-bind="click: items.prev">Previous</a>
            </li>
            <li data-bind="css: {'disabled': !items.next.enabled()}">
                <a href="#" data-bind="click: items.next">Next</a>
            </li>
        </ul>

    </div>

CSS

.pager {
    margin-bottom:0;
}

JavaScript

// sample data
var data = [
    {city:"Fort Dodge", zip:"348dgfdg dfgjkhjkdhgjdfhjhfg jdkghfjd gjdfjkghsdf dfjghdfjkgh jsd ghjkdgh djhgjdsfh gdf g dfgdfg df gdfg dfg dfg df gdfgdfg dfg dfg dfg dfg 89"},
    {city:"Fitchburg", zip:"83366"},
    {city:"Menomonee Falls", zip:"52534"},
    {city:"Norfolk", zip:"02232"},
    {city:"Dearborn", zip:"55899"},
    {city:"Pomona", zip:"90483"},
    {city:"Port Orford", zip:"02565"},
    {city:"Clovis", zip:"98500"},
    {city:"Sister Bay", zip:"20285"},
    {city:"Bethlehem", zip:"57757"},
    {city:"Broken Arrow", zip:"18820"},
    {city:"Idabel", zip:"65964"},
    {city:"Macomb", zip:"43974"},
    {city:"Dearborn", zip:"03451"},
    {city:"Corinth", zip:"93401"},
    {city:"El Paso", zip:"26282"},
    {city:"Cortland", zip:"67010"},
    {city:"Barre", zip:"52555"},
    {city:"Aspen", zip:"62155"},
    {city:"New Brunswick", zip:"68095"},
    {city:"Garland", zip:"85242"},
    {city:"Gloucester", zip:"33586"},
    {city:"Beacon", zip:"21493"},
    {city:"New Rochelle", zip:"82251"},
    {city:"Fairbanks", zip:"66241"},
    {city:"Lewiston", zip:"38572"},
    {city:"Bismarck", zip:"91912"},
    {city:"Hammond", zip:"69642"},
    {city:"Uniontown", zip:"31508"},
    {city:"Rolla", zip:"92430"}
];
/*
knockout-paged.js - A Pager Plugin for Knockout.JS
Written By: Leland M. Richardson



Desired API:

    .paged(Number pageSize);
        assumes static data, creates pager with given pageSize

    .paged(Number pageSize, String url);
        assumes `url` is an AJAX endpoint which returns the requested data with
        url parameters "pg" and "perPage"

    .paged(Object config);
        pass config object with optional + required parameters (most flexible)

    //todo: perhaps some "inf-scroll" type functionality?
    //todo: restful configuration?

    Object Configuration:
    .paged({
        pageSize: Number (10),
        cached: Boolean (true),


        url: String


    });


 */



;(function(ko,$){

    // module...