title: Using jQuery to set input box title to value
body: <p>I am creating input text boxes that will set its title attribute as its value when the page is loaded. When the user clicks on a textbox, its value will be cleared, and when the textbox loses focus, either the user entered value will remain, or the default value will take its place.</p>
  
  <p><strong>Problem:</strong> I cant seem to make the textbox's value to be set on page load. Changing the value on focus and on blur works well though. What is wrong?</p>
  
  <h3>jQuery code</h3>
  
  <pre><code>$(function() {
      ///////////////////
      // Register Form //
      ///////////////////
      $(".splash_register_short_input, .splash_register_long_input").value = $(this).attr('title');
      $(".splash_register_short_input, .splash_register_long_input").value = $(".splash_register_short_input, .splash_register_long_input").attr('title');
  
      $(".splash_register_short_input, .splash_register_long_input").focus(function() {
          if (this.value == $(this).attr('title')) {
              this.value = '';
          }
      });
  
      $(".splash_register_short_input, .splash_register_long_input").blur(function() {
          if (this.value == '') {
              this.value = $(this).attr('title');
          }
      });
  });
  </code></pre>
  
  <h3>HTML code</h3>
  
  <pre><code>&lt;div id="splash_register_form"&gt;
      &lt;input type="text" name="register_first_name" class="splash_register_short_input" title="First Name" /&gt;
      &lt;input type="text" name="register_last_name" class="splash_register_short_input" title="Last Name" /&gt;
      &lt;input type="text" name="register_email" class="splash_register_long_input" title="Email" /&gt;
      &lt;input type="text" name="register_password" class="splash_register_long_input" title="Password" /&gt;
  &lt;/div&gt;
  </code></pre>