Why can't I stop this js click event propogation
<p>I'm trying to override a click handler by intercepting the event in an inline handler and stopping propagation (propogation disabling code taken from <a href="http://stackoverflow.com/a/5108218/165673">here</a>). </p>

<p>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.</p>

<p>fiddle: <a href="http://jsfiddle.net/trKN4/3/" rel="nofollow">http://jsfiddle.net/trKN4/3/</a></p>

<p><strong>HTML:</strong></p>

<pre><code>&lt;a onclick='stopIt(event);'&gt;do it&lt;/a&gt;​
</code></pre>

<p><strong>JS:</strong></p>

<pre><code>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');
    });                   

});
</code></pre>
