Scrolling Pagination on Gridview via JQuery - Help

Having some problems with a solution that apparently works:

<script type="text/javascript" >
        //following code utilizes jQuery 1.2.6
        var prev = 0;
        $(document).ready(

        //DIV showing the message "Loading..." is hidden initially
        //The message will be shown when records are fetched with AJAX 
        //when user has scrolled to the bottom of the DIV scrollbar 
        function() {
            $(".divProgress").hide();

            $(".divLeft").scroll(

        function() {
        //triggering point is when the difference of the heights of the TABLE 
        //and DIV match the DIV's scrollTop value
        if ($('<%=grdPersonResults.ClientID %>').height() - this.scrollTop == $(this).height()) {
        //progress bar         
        $(".divProgress").ajaxStart(function() {
            $(this).show();
        });
        $(".divProgress").ajaxStop(function() {
            $(this).hide();
        });

        //get last Order Id to track next fetch
        var OrderIdLast = $('<%=grdPersonResults.ClientID %> tr:last').children("td:first").html();

        //get last table row in order to append the new result set increment
        var trLast = $('<%=grdPersonResults.ClientID %> tr:last');
        if (parseInt(OrderIdLast, 10) > parseInt(prev, 10)) {
            prev = OrderIdLast;
            //make a async call to fetch the incremental results     
            $.post("AsyncHandler.ashx?lastOrderId=" + OrderIdLast, function(data) {
                if (data != null) {
                    //append new result set to last row
                    trLast.after(data);
                }
            });
        }
    }
});
});
    </script>

My Gridview is fairly simple:

<div class="divLeft">
                    <asp:GridView ID="grdPersonResults" AutoGenerateColumns="False" runat="server"
                        CellPadding="2" Width="100%" ForeColor="#333333" GridLines="None" BorderWidth="1px" BorderStyle="Solid"
                        BorderColor="Black" AllowSorting="True" CssClass="box-table-a">
                        <Columns>
                            <asp:HyperLinkField HeaderText="Name" SortExpres开发者_开发问答sion="NAME" DataNavigateUrlFields="EMPLOYEE_ID, COMPANY_ID, RNUM"
                                DataNavigateUrlFormatString="~/Admin/FinalizeEdit.aspx?id={0}&cid={1}&rnum={2}&action=EDIT" DataTextField="NAME" />
                            <asp:BoundField DataField="DESCRIPTION" HeaderText="Company" SortExpression="DESCRIPTION" />
                            <asp:BoundField DataField="SOURCE_ID" HeaderText="Source" SortExpression="SOURCE_ID" />
                        </Columns>
                        <FooterStyle CssClass="box-table-a" />
                        <RowStyle CssClass="box-table-a" />
                        <EditRowStyle CssClass="box-table-a" />
                        <SelectedRowStyle CssClass="box-table-a" />
                        <PagerStyle CssClass="box-table-a" />
                        <HeaderStyle CssClass="box-table-a" />
                        <AlternatingRowStyle CssClass="box-table-a" />
                    </asp:GridView>
                </div>
                <div class="divProgress">
                    Loading....
                </div>

It doesn't ever seem to hit my AsyncHandler, not sure if my selectors are wrong since I'm using a Masterpage in ASP.net, but it seems to be picking up the elements.

---

change

if ($('<%=grdPersonResults.ClientID %>').height() - this.scrollTop == $(this).height()) {

to

if ($("#grdPersonResults").height() - this.scrollTop <= $(this).height()-2) {