(function($){  
$.fn.usableForms = function() { 
  
  $(this).each(function(){
    // get the input id
    var id = $(this).attr('id');
    
    // get the label
    var label = $('label[for=' + id + ']').html();
    
 	  // hide the label
    $(this).prev('label[for=' + id + ']').hide();
  
    // set the input value to label
 	  $(this).val(label);
 	
 	  // on click: if the input value equals the label, empty the input field. Else: do nothing.
 	  $(this).focus(function(){
 	    if($(this).val() == label){
 	      $(this).val('');
 	    }
 	  });
 	
 	  // on blur: if the input value is empty, bring back the label. Else: user input stays in the field.
 	  $(this).blur(function(){
 	    if($(this).val() == ''){
 	      $(this).val(label);
 	    }
 	  });
  });
 	
}
})(jQuery);