title: Is it possible to stop the browser from following the link when the onclick of the child element fires?
body: <p>This is what I have basically:</p>
  
  <pre><code>&lt;a href="http://somelink.com"&gt;
      &lt;span&gt;stuff&lt;/span&gt;
      &lt;span onclick="AwesomeFunction();"&gt;more stuff&lt;/span&gt;
      &lt;span&gt;the last stuff&lt;/span&gt;
  &lt;/a&gt;
  </code></pre>
  
  <p>Now, the problem is I want to keep the parent as a link but if the user clicks the span with the onclick event I don't want the browser to follow the link.</p>
  
  <p>I've tried</p>
  
  <pre><code>event.stopPropagation();
  </code></pre>
  
  <p>but that only seems to stop the links onclick event from firing, or I'm doing something wrong.</p>
  
  <p>I'm currently sort of in crunch mode and I don't want to spend too much time rewriting the code that generates this HTML, but it still can't be a hack since it's implemented in a pretty vital function of the site. Any help appreciated.</p>