JSFiddle - React, Tailwind, and code Playground

by Jason

HTML

<p><strong>2014</strong> -&nbsp;<a href="#jan2014">January</a>&nbsp;|&nbsp;<a href="#feb2014">February</a>&nbsp;|&nbsp;<a href="#mar2014">March</a>&nbsp;|&nbsp;<a href="#apr2014">April</a>&nbsp;|&nbsp;<a href="#may2014">May</a>&nbsp;|&nbsp;<a href="#jun2014">June</a>&nbsp;|&nbsp;<a href="#jul2014">July</a>&nbsp;|&nbsp;<a href="#aug2014">August</a>&nbsp;|&nbsp;<a href="#sep2014">September</a>&nbsp;|&nbsp;<a href="#oct2014">October</a>&nbsp;|&nbsp;<a href="#nov2014">November</a>&nbsp;|&nbsp;<a href="#dec2014">December</a>
</p>
<p>&nbsp;</p>
<h2 id="jan2014">January 2014</h2><a href="#" class="nextMonth">Next Month</a>
<div class="tablecolor" style="width:100%;">
    <table summary="2014 Grants Calendar" cellpadding="0" cellspacing="0">
        <thead>
            <tr>
                <th scope="col">Sunday</th>
                <th scope="col">Monday</th>
                <th scope="col">Tuesday</th>
                <th scope="col">Wednesday</th>
                <th scope="col">Thursday</th>
                <th scope="col">Friday</th>
                <th scope="col">Saturday</th>
            </tr>
        </thead>
        <tr>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
            <td>
                <div>1</div>
                <p>&nbsp;</p>
                <p>&nbsp;</p>
            </td>
            <td>
                <div>2</div>
                <p>&nbsp;</p>
                <p>&nbsp;</p>
            </td>
            <td>
                <div>3</div>
                <p>&nbsp;</p>
                <p>&nbsp;</p>
            </td>
            <td>
                <div>4</div>
                <p>&nbsp;</p>
                <p>&nbsp;</p>
            </td>
        </tr>
        <tr>
            <td>
                <div>5</div>
                <p>&nbsp;</p>
                <p>&nbsp;</p>
            </td>
            <td>
                <div>6</div>
                <p>&nbsp;</p>
                <p>&nbsp;</p>
            </td>
 ...

JavaScript

$(".previousMonth").click(function (e) {
    e.preventDefault();
    //		$(this).prev("div.tablecolor").scrollTop(); 
    $('html, body').animate({
        scrollTop: $('.tablecolor').offset().top - 20
    }, 'slow');
});
$(".nextMonth").click(function (e) {
    e.preventDefault();
    $(".tablecolor").nextAll().eq(1);
});