Instead of a navigation menu, my client would like to show NEXT and PREV links to click through the site's pages. Something like this:
HTML Code:
<div id="prevnext">
    <ul>
        <li class="next"><a href="page-3.php">NEXT</a></li>
        <li class="prev"><a href="page-1.php">PREV</a></li>
    <.ul>
</div>
I'm loading the page content using AJAX and a jQuery fade in and out. But the NEXT and PREV links need to be in the footer.php and be incrementing after a new page is loaded. The script looks like this:
HTML Code:
var $mainContent = $('#main-content'),
newHash = '';

$("#prevnext").delegate("a", "click", function() {
    window.location.hash = $(this).attr("href");
    return false;
});
	
$(window).bind('hashchange', function() {
									  
    newHash = window.location.hash.substring(1);
							  
    if (newHash) {
        $mainContent
            .find("#content")
            .fadeOut(600, function() {
                $mainContent.hide().load(newHash + " #content", function() {
                    $mainContent.fadeIn(600);				  
		});
            });
    };
										  
});

$(window).trigger('hashchange');
My pages could be named page-1.php, page-2.php and so on. That works for me. I'm looking for a way to update and increment the NEXT and PREV links after each click. I would add the increment using PHP, but since I'm loading the pages with AJAX, the page is not refreshing.

I would also like to hide the PREV link if there is no page to show, and hide the NEXT link if we're at the end of the list.