title: jquery click() and on() not working
body: <p>in the below code click() is not working
  what is the problem i have tried $("login").on("click",function(){}); function also not still not working</p>
  
  <pre><code>&lt;html&gt;
  
  &lt;head&gt;
  
      &lt;!--- Links ---&gt;
      &lt;link rel="stylesheet" href="bootstrap.min.css"&gt;
      &lt;link rel="stylesheet" href="style.css"&gt;
  
      &lt;head&gt;
          &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"&gt;&lt;/script&gt;
          &lt;script src="main.js"&gt;&lt;/script&gt;
      &lt;/head&gt;
      &lt;!--html--&gt;
      &lt;title&gt;Test Page&lt;/title&gt;
  
  
      &lt;script&gt;
          $("#login").click(function() {
              alert("hai");
          });
      &lt;/script&gt;
  &lt;/head&gt;
  
  &lt;body onload="$('#reg').toggle();"&gt;
      &lt;div id="user-area"&gt;
          &lt;div class="btn-area"&gt;
              &lt;button id="btnlgn" class="btn btn-outline-primary" onclick="toggleReg()"&gt;Login /Register&lt;/button&gt;
  
          &lt;/div&gt;
          &lt;div id="forms"&gt;
              &lt;div class="form" id="reg"&gt;
                  &lt;form class="form-sigin" id="register"&gt;
                      &lt;input type="text" class="form-control" placeholder="Email" id="email"&gt;
                      &lt;input type="name" class="form-control" placeholder="Full Name" id="name"&gt;
                      &lt;input type="password" class="form-control" placeholder="password" id="password"&gt;
                      &lt;input type="password" class="form-control" placeholder="Re-enter password" id="conPassword"&gt;
                      &lt;input type="tel" class="form-control" placeholder="Mobile Number" id="number"&gt;
  
                  &lt;/form&gt;
                  &lt;button class="btn" id="register"&gt;Register&lt;/button&gt;
              &lt;/div&gt;
              &lt;div class="form" id="lgn"&gt;
                  &lt;form class="form-sigin" id="sigin"&gt;
                      &lt;input type="text" class="form-control" placeholder="Email" id="emaillgn"&gt;
                      &lt;input type="password" class="form-control" placeholder="password" id="passwordlgn"&gt;
  
                  &lt;/form&gt;
                  &lt;button class="btn" id="login"&gt;Login&lt;/button&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/body&gt;
  
  &lt;/html&gt;
  </code></pre>
  
  <p>i am trying to display an alert when the button is pressed </p>
  
  <pre><code> &lt;script&gt;
              $("#login").on("click", function() {
                  alert("hai");
              });
  
          &lt;/script&gt;
  </code></pre>
  
  <p>this is also not working</p>