textbox auto resize on click
<p>I am trying to have a text box resize on click.</p>

<p>in the head:</p>

<pre><code>&lt;style&gt;
.expand {
    height: 1em;
    width: 50%;
    padding: 3px;
}
&lt;/style&gt;
&lt;script type="text/javascript" src="https://www.google.com/jsapi"&gt;&lt;/script&gt;
&lt;script&gt;
$('textarea.expand').focus(function () {
    $(this).animate({ height: "1000px" }, 500);
});
&lt;/script&gt;
</code></pre>

<p>and body:</p>

<pre><code>&lt;form&gt;
&lt;textarea class="expand" rows="1" cols="10"&gt;&lt;/textarea&gt;
&lt;/form&gt;
</code></pre>

<p>it is not expanding for me.</p>
