title: Cannot get value of textbox by jquery
body: <p>javascript</p>
  
  <pre><code>&lt;script&gt;
      jQuery(function ($) {                                  
          var userName = jQuery("#userName").val();
  
          $('#btnsubmit').click(function () {
              alert(userName);
  
          });
      });
  &lt;/script&gt;
  </code></pre>
  
  <p>HTML</p>
  
  <pre><code>&lt;div class="contact"&gt;
      &lt;div class="contact-form"&gt;
          &lt;h2&gt;Check Out&lt;/h2&gt;
          &lt;div&gt;
              &lt;span&gt;&lt;label&gt;Name&lt;/label&gt;&lt;/span&gt;
              &lt;span&gt;&lt;input name="userName" type="text" class="textbox" id="userName"&gt;&lt;/span&gt;
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="clear"&gt;&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I cannot get the value of the textbox. It is always empty when I click the button. Please help me to the value of the textbox to use with ajax.</p>