jQuery has detected parents incorrectly
<p>I have html structure like below:</p>

<pre><code>&lt;div id="banner-menu-holder"&gt;
    &lt;div&gt;
        &lt;div class="avalible"&gt;
            &lt;div class="items-holder"&gt;
                &lt;div&gt;
                    &lt;div class="img-holder"&gt;
                        &lt;div&gt;
                            &lt;input id="set_banner_29" type="checkbox" onclick="mod.setBanner(29);"&gt;
                            ...
                        &lt;/div&gt;
                    &lt;/div&gt;
                &lt;/div&gt;
                ...
            &lt;/div&gt;
        &lt;/div&gt;
        &lt;div class="ready"&gt;
            &lt;div class="items-holder"&gt;
                &lt;div&gt;
                    &lt;div class="img-holder"&gt;
                        &lt;div&gt;
                            &lt;input id="rem_banner_1_8_32" class="remove_banner" type="checkbox" checked="checked"&gt;
                            ...
                        &lt;/div&gt;
                    &lt;/div&gt;
                &lt;/div&gt;
                ...
            &lt;/div&gt;
        &lt;/div&gt;
    &lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p>and js code:</p>

<pre><code>$(document).click(function(ev) {
    if ($(ev.target).parents().index($('#banner-menu-holder')) == -1) {
        $('#banner-menu-holder').css('display', 'none');
    }        
})
</code></pre>

<p>When I clicked checkbox into first div (class avalible) then function has been successfull executed - this chekbox is child of main div (#banner-menu-holder).</p>

<p>When I clicked second div's checkboxes and the function had not worked. jQuery didn't detected that these checkboxes are children of main div.</p>

<p>Is that problem into jQuery or otherwise?</p>
