jQuery fadeIn effect
<p>I am not sure why the following code is not behaving the way I would expect it to, but as I am new to jQuery I am sure that I'm missing something elementary.</p>

<p>html:</p>

<pre><code>&lt;div id="locale"&gt;&lt;/div&gt;

&lt;form id="theForm"&gt;
What would you like to do?&lt;br /&gt;&lt;br /&gt;
&lt;input type="text" id="doThis" /&gt;&lt;br /&gt;&lt;br /&gt;
&lt;/form&gt;
</code></pre>

<p>js:</p>

<pre><code>$(document).ready(function() {
    $("#theForm").submit(function(){
     var doThis = $("#doThis").val().toLowerCase();
     $("#locale").html(doThis).fadeIn("slow");
     return false;
    });
});
</code></pre>
