Get value inside a text field - JavaScript - jQuery
<p>I have a page portion as below;</p>

<pre><code>&lt;input name="test1" type="text" id="test1" class="test1"&gt;
&lt;button value="hi" id="but"&gt;hi&lt;/button&gt;
</code></pre>

<p>I want to get data inside text field entered by user. I tried the following;</p>

<pre><code>$(document).ready(function(){
var test2 = $('#test1').val();
        $('#but').click(function() {
        alert(test2);
});
});
</code></pre>

<p>When user clicks button <code>hi</code>, the page alerts the text inside text field. But the alert is coming blank (without text) even with text inside. When I reload the page, the text inside text field remains there and when I click the button again, script works well alerting the text inside. Again when I clear the text and I give another text, and when I click button, the alert is coming with previous text.</p>

<p>I am using jQuery.</p>

<p><a href="http://jsfiddle.net/wdKWw/" rel="nofollow"><strong>Here</strong></a> is the fiddle.</p>

<p>I want to get alert with text inside the text area. How can I do this?</p>
