Why is my jQuery code not working?

[h e g 3]

Well I know the code works because I am using it on three other pages and it works fine, however I have moved on to make a mobile version of my website. Basically, the code is used to login in realtime. It serializes the users data, displays a "Logging in" message and then sends an ajax request to a file. The contents of the response from that file then replace the login message and depending on the situation, different things happen. I directly ported the code over from a working example and now, despite many changes to the code, the jquery does not seem to be firing at all. Here is my jquery code:\[code\]function login() { var dataString = $('#login_form').serialize(); console.log(dataString); $(".menu_login_form").html("<center>Logging in...</center>"); $.ajax({ type: "POST", url: "../include/actions/login.php", data: dataString, cache: false, success: function(html){ $(".menu_login_form").html(html); } }); return false; }; $("#login_form").on("submit", login);\[/code\]And here is my html code:\[code\]<div class="menu_login_form"> <form id="login_form" method="post"> <input type="text" name="username" placeholder="Username"><br> <input type="password" name="password" placeholder="Password" style=""><br> <input type="checkbox" name="remember" checked="checked" style="margin:0;margin-right:10px;margin-top:-2.5px"><span>Remember Me</span><br> <input type="submit" value="http://stackoverflow.com/questions/15592402/Login..." id="login_form_btn" class="btn"> </form></div>\[/code\]Does anybody know whats wrong here?