jQuery popup div fades out after fading in
<p>I have a DIV element right at the beginning of my HTML code</p>

<pre><code>&lt;div id="popup"&gt;&lt;/div&gt;
</code></pre>

<p>Its CSS <code>display</code> property is set to <code>none</code> initially. Now when I click on specific HTML elements, the following happens:</p>

<pre><code>$('#popup-opener-button').click(function() {
    $('#popup').fadeIn();
});
</code></pre>

<p>This works like charm. Now I'd like this DIV to disappear whenever I click anywhere on the screen, except when clicking on the DIV itself. I thought this would do it:</p>

<pre><code>$('#popup').siblings().click(function() {
    $('#popup').fadeOut();
});
</code></pre>

<p>but as the SPAN I'm clicking on to fade in my popup div is actually the child of #popup's sibling, it instantly fades out right after fading in. Is there a way not to do this?</p>
