JSFiddle - React, Tailwind, and code Playground

by antelopelovefan

HTML

<input type="text" name="Name" id="Name" placeholder="Name" /><br />
<input type="text" name="Company" id="Company" placeholder="Company" /><br />
<input type="text" name="Email" id="Email" placeholder="Email Address" /><br />
<input type="text" name="Phone" id="Phone" placeholder="Phone Number" /><br />

JavaScript

( function($) {
    $(document).ready( function() {
        $('input[type=text]').each( function(idx, elem) {
            $(this).val($(this).attr('placeholder'));
        }); 
        $('input[type=text]').focus( function(e) {
            if($(this).val() == $(this).attr('placeholder')) {
                $(this).val('');
            }
        });
        $('input[type=text]').blur( function(e) {
            if($(this).val() === '') {
                $(this).val($(this).attr('placeholder'));
            }
        });
    });
})(jQuery);