jQuery dialog not working as expected
<p>It might be a stupid problem, but I am very new to jQuery. I am trying to create a button that on-click will pop-up a login dialog. Somehow the form is shown instead of being created as a dialog. Below is my code:</p>

<pre><code>&lt;head&gt;
    &lt;script src="js/jquery-ui-1.8.21.custom.min.js"&gt;&lt;/script&gt;
    &lt;script&gt;
        $(function() {   
            $('#login').dialog({
                    autoOpen: false,
                    title: 'Login',
                    height: 300,
                    width: 350,
                    modal: true
            });

            $('#open').click(function() {
                $('#login_form').dialog('open');
                return false;
            });
        });
    &lt;/script&gt;        
    &lt;meta charset="utf-8" /&gt;
    &lt;title&gt;&lt;/title&gt;
&lt;/head&gt;
&lt;body&gt;
    &lt;div id="login"&gt;
        &lt;form class="caption" action="Login.php" method="post"&gt;           

        &lt;p&gt;E-mail: &lt;br&gt;&lt;input type="text" name="email" maxlength="255" /&gt;&lt;/p&gt;
        &lt;p&gt;Password:&lt;/p&gt; &lt;br&gt;&lt;input type="password" name="pwd" /&gt;&lt;/p&gt;
        &lt;p&gt;&lt;input type="submit" value="Login" /&gt;&lt;/p&gt;

        &lt;/form&gt;

    &lt;/div&gt;
    &lt;button id="open"&gt;Click&lt;/button&gt;
&lt;/body&gt;
</code></pre>

<p></p>

<p>Any idea what I have done wrong? Thank you very much!</p>
