jQuery val() method not working
<p>I wanted to read the value entered in the text box in one of my HTML form, for this I tried jQuery <code>val()</code> method, but it is not working, any idea why?</p>

<p>HTML:</p>

<pre><code>&lt;form method="POST" id="payment-form"&gt;
   &lt;p&gt;
      &lt;label class="card-number" for="txt_cardno"&gt;&lt;span&gt;Card Number:&lt;/span&gt;&lt;/label&gt;
      &lt;input type="text" size="20" autocomplete="off" class="card-number" id="txt_cardno" name="cardno" /&gt;
   &lt;/p&gt;
   &lt;p class="submit submit-button"&gt;&lt;a class="btn" href="#"&gt;Charge Card&lt;/a&gt;&lt;br&gt;&lt;a class="btn" href="#" onClick="return false"&gt;Go Back&lt;/a&gt;&lt;/p&gt;
   &lt;div class="clear"&gt;&lt;/div&gt;
&lt;/form&gt;
</code></pre>

<p>Javascript:</p>

<pre><code>$(document).ready(function() {
    $(".submit").live("click", function(e) {
        e.preventDefault();
        var card_num = $('.card-number').val();
        alert(card_num);
    });
});
</code></pre>

<p>the jsfiddle is <a href="http://jsfiddle.net/74neK/1/" rel="nofollow">http://jsfiddle.net/74neK/1/</a></p>
