jquery.friendly-textbox.js

// Provides default text in a textbox that disappears when focused
// Note: also toggles an 'active' CSS class so you can change text color

(function($) {
  $.fn.friendlyTextBox = function(msg) {
    var regex = new RegExp('^' + msg + '$')

    $(this).focus(function() {
      if ($(this).val().match(regex)) $(this).val('')
      $(this).addClass('active')
    }).blur(function() {
      if ($(this).val() == '') $(this).removeClass('active').val(msg)
    })
  }
})(jQuery);

styling-example.css

/* Example of how to make use of the 'active' CSS class...
   - by default make the text light (#999)
   - when active make the text dark (#111) */

input[type=text] {
  color: #999;
}
input.active[type=text] {
  color: #111;
}

usage.js

// Typical usage for something like:
//  <input id="q" type="text" name="q" value="Enter Your Search" />

$(function() {
  $('input#q').friendlyTextBox('Enter Your Search');
});