title: focus() input element with jQuery, but the cursor doesn't appear
body: <p>I want to focus an input element when a div is clicked.</p>
  
  <p>My HTML looks like this:</p>
  
  <pre><code>&lt;div class="placeholder_input"&gt;
      &lt;input type="text" id="username" maxlength="100" /&gt;
      &lt;div class="placeholder_container"&gt;
          &lt;div class="placeholder"&gt;username&lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>And my script is:</p>
  
  <pre><code>$("#username").focus(function() {
      $(this).next().hide();
  });
  
  $(".placeholder_input").mousedown(function() {              
      $(this).children(":first").focus();
  });
  </code></pre>
  
  <p>When I click into the textbox, the placeholder text disappears correctly, but the blinking cursor doesn't show in the textbox. (and I can't type any text into the textbox)</p>
  
  <p>Inside of the <code>mousedown</code> event handler, the <code>$(this).children(":first")</code> expression selects the correct input element, so I have no idea why the <code>focus()</code> call doesn't work.</p>