javascript - Why can't I stop this js click event propogation

Question

I'm trying to override a click handler by intercepting the event in an inline handler and stopping propagation (propogation disabling code taken from here).

The following code not only doesn't stop the propagation, it's not even firing the inline handler. I can't tell what's wrong.

fiddle: http://jsfiddle.net/trKN4/3/

HTML:

<a onclick='stopIt(event);'>do it</a>​

JS:

function disableEventPropagation(event)
{
   if (event.stopPropagation){
       event.stopPropagation();
   }
   else if(window.event){
      window.event.cancelBubble=true;
   }
}

function stopIt(event) {
    disableEventPropagation(event);
    alert('dont do it');
}


$(function() {

    $('a').click(function(e){
        alert('im doing it');
    });                   

});

Answer 1

It's not firing the inline function because jsFiddle is wrapping all your code in an onload handler, taking it out of the reachable scope of the handler.

Choose a no wrap option from the menu on the left.

DEMO: http://jsfiddle.net/trKN4/4/