JSFiddle - React, Tailwind, and code Playground

HTML

<form class="left push-bottom-px10 width-match-parent">
    <input type="text" id="email" value="email"/> 
    <input type="text" id="password" value="password"/> 
</form>

JavaScript

$(document).ready(function() {
    $('#email').bind('focus', function() {
        var currentValue = $.trim($(this).val());
        if(currentValue == 'email') $(this).val('');
    });
    $('#email').bind('blur', function() {
        var currentValue = $.trim($(this).val());
        if(currentValue == '') $(this).val('email');
    });
    $('#password').bind('focus', function() {
        var currentValue = $.trim($(this).val());
        if(currentValue == 'password') {
            $(this).val('');
            $(this).attr('type', 'password');
        }
    });
    $('#password').bind('blur', function() {
        var currentValue = $.trim($(this).val());
        if(currentValue == '') {
            $(this).val('password');
            $(this).attr('type', 'text');
        }
    });
});