Диалоговое окно Jquery не открывается при нажатии на ссылку

У меня есть подменю в строке меню, которому необходимо перейти к определенной ссылке. Но прежде чем перейти к ссылке, мне нужно открыть диалоговое окно jquery в форме входа, чтобы ввести имя пользователя и пароль. При отправке имени пользователя и пароля мне нужна ссылка для перехода к конкретному место назначения..

Здесь проблема заключается в том, что при нажатии подменю ни он не открывает форму входа в jquery диалоговое окно, либо он переходит на конкретный сайт..

Вот мой html для строки меню.

<li><a href="#"><span>Settings</span></a>
            <div><ul>
                    <li><a href="Createuser.jsp" class="loginlink"><span>Create New Account</span></a></li>    
                </ul></div>
</li>

и вот моя форма входа в jquery...

<a href="/login" style="display:none" class="loginlink">Log In</a>

<div id="loginform" style="display:none">
    <form action="Createuser.jsp" method="post">
        <table>
            <tr>
                <td>User Name:</td>
                <td>
                    <input name="username" id="username" type="text" />
                </td>
            </tr>
            <tr>
                <td>Password:</td>
                <td>
                    <input name="password" id="password" type="password" />
                </td>
            </tr>
            <tr>
                <td colspan="2" style="text-align:center;">
                    <input type="submit" value="Login" />
                </td>
            </tr>
        </table>
    </form>
</div>

и ниже мой документ. Уже функционирует. Пожалуйста, см...

$('a.loginlink').click(function(e) {
            e.preventDefault();
            $('#loginform').dialog('open');
            e.preventDefault();
            return false;
        });

        $('#loginform').dialog({
            autoOpen: false,
            modal: true,
            resizable: false,
            draggable: false
        });