Jquery: Hide a text box and then show it
<p>I am very new to jquery. I have a major doubt here. Basically I wanna do a recursion kind of thing in jquery! I have a textbox inside a div. The user would enter his name in the textbox and then when he clicks out of the textbox , i want to hide the textbox and print whatever the user wrote in the textbox in the division(I am able to do that perfectly fine, but the problem lies ahead). Suppose if the user commits some mistake in typing, now what I want is I want that same textbox back when the user clicks back on that div. And then when again he clicks out of that textbox, the textbox should hide and the entered text should be printed in the div.</p>

<p>My HTML CODE:</p>

<pre><code> &lt;html&gt;
&lt;body&gt;
&lt;div style="width:18px; font-weight:bold; text-align:center;" id="filltheblank1" &gt;  &lt;input   type="text"  /&gt;&lt;/div&gt;
&lt;/body&gt;
&lt;/html&gt;
</code></pre>

<p>Jquery:</p>

<pre><code>$(document).ready(function () {
  $("#filltheblank1").children(this).blur(function () {
    if ($(this).val()) {
      var entered = $(this).val().toUpperCase();
    }
    $(this).hide(500, function () {
      $(this).parent(this).html(entered).click(function () {
        //now what to do here. I want that when user clicks o the div, the textbox should come back and when he clicks out again, it should go away and the text he entered should be preinted

      });
    });
  });
}); 
</code></pre>

<p>please help someone</p>
