jQuery: issues with mouseover event if the element has children
<p>I have the following element:</p>

<pre><code>&lt;div id="#block-block-1"&gt;
    &lt;p&gt;KAREN LANCEL:&lt;br&gt;
lancel(at)xs4all.nl&lt;br&gt;
phone 0031 (0)624873424&lt;/p&gt;
&lt;p&gt;HERMEN MAAT:&lt;br&gt;
maat(at)xs4all.nl&lt;br&gt;
phone 0031 (0)628536885&lt;/p&gt;
&lt;/div&gt;
</code></pre>

<p>which is supposed to disappear when the mouse is moved out of it (I will ignore now to talk about the fading in event).</p>

<p>This is the code to make it fading out:</p>

<pre><code>$('#block-block-1').mouseout(function() {
        $(this).css("display","none");
    });
</code></pre>

<p>The issue here is that the 'mouseout' event is triggered when the mouse is over the children <p> elements inside my div. And the parent  disappears even if the mouse is still inside it.</p>
