So I'm doing some basic href functionality replacement for users that have JS enabled. I admit I'm more of a PHP guy so I may have some syntax issues in my JQuery, please point those issues out.

This will replace all my href attributes in my nav links to remove their functionality and then replace with an click event listener...
Code:
function replaceLinks() {
    $('#nav_ribbon li a').each(function() {
        $(this).attr({'href': 'javascript:void(0)'}).on('click', navLinkClick(this));
    });
}
function navLinkClick(selector) {
    var pageValue = $(selector).attr('title').toLowerCase();
    var page = pageValue + '.php';
    $('#content').load(page);
}
So on document ready I run replaceLinks but when my page loads it automatically activates the handler without the event taking place... so I end up with loaded content instead of the home page content

sample of the navigation html:
HTML Code:
<div id="nav_ribbon"> <a class="header_logo" href="index.php"><img title="Home" alt="Logo" src="img/logo.png" /></a>
<ul>
   <li><a title="page0" class="nav_item" href="index.php">page0</a></li>
   <li><a title="page1" class="nav_item" href="index.php?page=page1">page1</a></li>
   <li><a title="page2" class="nav_item" href="index.php?page=page2">page2</a></li>
   <li><a title="page3" class="nav_item" href="index.php?page=page3">page3</a></li>
   <li><a title="page4" class="nav_item" href="index.php?page=page4">page4</a></li>
   <li><a title="page5" class="nav_item" href="index.php?page=page5">page5</a></li>
</ul>
</div>