$(document).ready(function() {
    var hintField;
    var hint = "-hint";

    $(".hint").css("display", "none");

    // ** SHOW hints
    // for INPUT fields
    $("input").focus(function () {
        hintField = $(this).attr("id") + hint;
        $("#" + hintField).css("display", "inline");
    });

    // for SELECT fields    
    $("select").focus(function () {
        hintField = $(this).attr("id") + hint;
        $("#" + hintField).css("display", "inline"); 
        //$(this).next("span").css("display", "inline");
    });
    
    // for TEXTAREA fields
    $("textarea").focus(function () {
        hintField = $(this).attr("id") + hint;
        $("#" + hintField).css("display", "inline");
        //$(this).next("span").css("display", "inline");
    });    
    
    
    
    // ** HIDE hints
    // for INPUT fields
    $("input").blur(function () {
        hintField = $(this).attr("id") + hint;
        $("#" + hintField).css("display", "none");
        //$(this).next("span").css("display", "none");
        //$("#hints span").empty();

    });
    
    // for SELECT fields
    $("select").blur(function () {
        hintField = $(this).attr("id") + hint;
        $("#" + hintField).css("display", "none");
        //$(this).next("span").css("display", "none");
    });

    // for TEXTAREA fields
    $("textarea").blur(function () {
        hintField = $(this).attr("id") + hint;
        $("#" + hintField).css("display", "none");
        //$(this).next("span").css("display", "none");
    });

});