index.html

<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript" src="script.js"></script>

<style>
    nav#main a[data-current] { color: red; }
</style>

<nav id="main">
    <a href="#!/">A</a>
    <a href="#!/derp">B</a>
    <a href="#!/herp">C</a>
</nav>

script.js

$(function() {
    var doNavigate = function(section) {
        section = section || window.location.href.split("#!/")[1] || "";
        section = section.target === undefined ? "#!/" + section : section.target.hash;
        
        $("nav#main a")
          .removeAttr("data-current")
          .filter("[href='"+ section +"']")
          .attr("data-current", "");
    };
    
    $("nav#main").on("click", "a", doNavigate);
    doNavigate();
});