title: jquery click function is responding weirdly. ajax call also not triggered
body: <p>Instead of a <code>POST</code> request, somehow <code>GET</code> is being triggered. </p>
  
  <p>Secondly, the ajax call is not being called. </p>
  
  <p>I have done this a hundred times, but everything I tried seem to do nothing. This could be some my fault somehow, but please help. If you need anything more please ask. Regards</p>
  
  <pre><code>$(document).ready(function(){
      console.log("bro");
      $("#login").click(function () {
          console.log("hi");
          var name = $('#uname').val();
          var password = $('#password').val();
          console.log(name);
          console.log(password);
          $.ajax({
              url:"login-check.php",
              data: {name:name, password:password},
              dataType:"text",
              method:"POST",
              success:function(data){
                  if(data === "1" || data === "2"){
                      alert(data);
                      console.log("hello");
                      window.open('index.php','_self');
                  }
                  else{
  
                  }
              }
          });
      });
  });
  </code></pre>
  
  <p>HTML:</p>
  
  <pre><code>&lt;!-- Form Code --&gt;
  &lt;div class = "container"&gt;
      &lt;h2 style="text-align:center;"&gt;Please Fill the form to Sign up&lt;/h2&gt;
      &lt;form class="form-horizontal"&gt;
          &lt;div class="form-group"&gt;
              &lt;label class="control-label col-sm-2" for="name"&gt;Username:&lt;/label&gt;
              &lt;div class="col-sm-10"&gt;
                  &lt;input type = "username" class = "form-control" name = "uname" id = "uname" placeholder = "username" required autofocus&gt;
              &lt;/div&gt;
          &lt;/div&gt;
          &lt;div class="form-group"&gt;
              &lt;label class="control-label col-sm-2" for="pwd"&gt;Password:&lt;/label&gt;
              &lt;div class="col-sm-10"&gt;          
                  &lt;input type = "password" class = "form-control" name = "password" id = "password" placeholder = "password" required&gt;
              &lt;/div&gt;
          &lt;/div&gt;
          &lt;div class="form-group"&gt;        
              &lt;div class="col-sm-offset-2 col-sm-10"&gt;
                  &lt;button class="btn btn-primary" name = "login" id="login"&gt;Sign In&lt;/button&gt;
              &lt;/div&gt;
          &lt;/div&gt;
       &lt;/form&gt;
  
       Click here to clean &lt;a href = "logout.php" tite = "Logout"&gt;Session.
  
  &lt;/div&gt;
  </code></pre>
  
  <p><a href="https://i.stack.imgur.com/V6S1Z.png" rel="nofollow noreferrer">console logs</a>
  <img src="https://i.stack.imgur.com/nMAL2.jpg" alt="network logs"></p>