title: Click event on table row - only trigger if nothing else is 'clicked'
body: <p>I'm having some issues with some jQuery code, and I'm hoping and thinking that the solution is relatively simple.</p>
  
  <p>Say I have a table like:</p>
  
  <pre><code>&lt;table&gt;
     &lt;tr&gt;
       &lt;td&gt;&lt;input type="checkbox" name="hai" value="der" /&gt;&lt;/td&gt;
       &lt;td&gt;&lt;a href="mypage.php"&gt;My link&lt;/a&gt;&lt;/td&gt;
       &lt;td&gt;Some data&lt;/td&gt;
       &lt;td&gt;Some more data&lt;/td&gt;
     &lt;/tr&gt;
     ...
  &lt;/table&gt;
  </code></pre>
  
  <p>Now through JavaScript I do the following in jQuery(document).ready();</p>
  
  <pre><code>jQuery("table tr").click(function(){
     var row = jQuery(this);
     var hasClass = row.hasClass("highlight");
     jQuery("table tr").removeClass("highlight");
     if(!hasClass){
       row.addClass("highlight");
     }
  });
  </code></pre>
  
  <p>All of this is pretty simple stuff - I want to be able to click a row and have it being highlighted and only one row can be highlighted at a time (obviously in my actual code I do more than that) - now here's my problem:</p>
  
  <p>When a user clicks the anchor tag, or the checkboxes, this triggers the row click event as well and I cannot work out how to filter that out? I know I need to include the event in my click handler, but how to check for this in a such way that it works in as many browsers as possible?</p>