Untitled

<script>
$(document).ready(function() {

    var $navlinks = $('#navigation li a'),
        $ajaxcontent = $('#ajax-content');

    $navlinks.click(function() {

            $('html, body').animate({scrollTop:0}, 'slow');

            $ajaxcontent.empty().append("<div id='loading'><img src='http://expression.ws/stackoverflow/load.gif' alt='Loading Content' /></div>");
            $navlinks.removeClass('selected');
            $(this).addClass('selected');

            $.ajax({ url: this.href, success: function(html) {
                $ajaxcontent.empty().append(html);
                }
            });

        return false;
    });

    $ajaxcontent.empty().append("<div id='loading'><img src='http://expression.ws/stackoverflow/load.gif' alt='Loading Content' /></div>");
    $.ajax({ url: 'page1.html', success: function(html) {
            $ajaxcontent.empty().append(html);
    }
    });
});
</script>
<body>

<div id="primarynav">
    <ul id="navigation">
        <li><a href="page1.html" class="selected">Page 1</a></li>
        <li><a href="page2.html">Page 2</a></li>
        <li><a href="page3.html">Page 3</a></li>
    </ul>
</div>

<div id="ajax-content">Ajax loads here</div>

</body>