jQuery clickable div with working mailto link inside
<p>I have a div that I want to be clickable but I need a mailto link inside that div to still work too. When I hover over the mailto link the mailto appears at the bottom of the browser but clicking activates the link attached to the div. Anyway around this? Thanks.</p>

<pre><code>&lt;div class="directory_search_results"&gt;
&lt;img src="images/no_photo.png" /&gt;   
&lt;ul class="staff_details"&gt;
&lt;li class="search_results_name"&gt;&lt;a href="http://www.netflix.com"&gt;Micheal Staff&lt;/a&gt;&lt;/li&gt;
&lt;li class="search_results_location"&gt;University of Illinois&lt;/li&gt;
&lt;li class="search_results_email"&gt;&lt;a href="mailto:test@test.org"&gt;test@test.com&lt;/a&gt;&lt;/li&gt;
    &lt;li class="search_results_phone"&gt;(407) 555-1212&lt;/li&gt;
    &lt;li class="search_results_office"&gt;(407) 555-1212&lt;/li&gt;
&lt;/ul&gt;&lt;/div&gt;
</code></pre>

<p>And now the jQuery</p>

<pre><code>$(document).ready(function(){       
$(".directory_search_results").click(function(){
         window.location=$(this).find("a:first-child").attr("href");
         return false;
});
</code></pre>
