E prevent default not working

Question

This is the code I am working with: http://jsfiddle.net/qKyNL/12/

$('a').click(function(){
    event.preventDefault();
    var number = $(this).attr('href');
    alert(number);
    // AJAX
    $.ajax({
        url: "/ajax_json_echo/",
        type: "GET",
        dataType: "json",
        timeout: 5000,
        beforeSend: function () {
            // Fadeout the existing content
            $('#content').fadeTo(500, 0.5);
        },
        success: function (data, textStatus) {
            // TO DO: Load in new content
            // Scroll to top
            $('html, body').animate({
                scrollTop: '0px'
            }, 300);
            // TO DO: Change URL
            // TO DO: Set number as active class
        },
        error: function (x, t, m) {
            if (t === "timeout") {
                alert("Request timeout");
            } else {
                alert('Request error');
            }
        },
        complete: function () {
            // Fade in content
            $('#content').fadeTo(500, 1);
        }
    });    
});

I am trying to create a degradable pagination, using Jquery but the problem is that the "e prevent default" doesn't seem to trigger and instead it still follows the link. Could anyone please show me how I can have this link degradable so if Jquery is disabled it still works.

Answer 1

You're not passing in the event object. Try this:

$('a').click(function(event){ // <-- notice 'event' passed to handler
event.preventDefault();