div click event not working
<p>I have this simple code that append a div inside the body, </p>

<pre><code>&lt;!DOCTYPE html&gt;
&lt;html&gt;


    &lt;head&gt;
        &lt;script type="text/javascript" src='/libs/jquery/jquery.js'&gt;&lt;/script&gt;
        &lt;script&gt;
            $(document).ready( function() {
                $('#show').click( function() {
                    $("&lt;div id='fade'&gt;&lt;/div&gt;").appendTo('body');
                    $('#fade').fadeIn('fast');
                });

                $('#fade').click( function() {
                    $('#fade').remove('fast');
                });
            });
        &lt;/script&gt;
    &lt;/head&gt;

    &lt;body&gt;
        &lt;div&gt;
            &lt;input type="button" value="show" id="show"/&gt;
        &lt;/div&gt;
    &lt;/body&gt;
&lt;/html&gt;
</code></pre>

<p>css</p>

<pre><code>#fade {
    display: none;
    background: black;
    opacity:0.4;
    filter:alpha(opacity=50);
    z-index: 1;
    position: fixed;
    left: 0; top: 0;
    width: 100%; height: 100%;
}

#window {
    width: 440px;
    height: 356px;
    background: white;
    position:fixed;
    left:50%;
    top:30%;
    margin:-70px 0 0 -245px;
    z-index: 2;
}
</code></pre>

<p>Appending my div#fade is working fine, but my click event on #fade isn't working. I looks simple but I didn't know why isn't working fine.</p>
