JSFiddle - React, Tailwind, and code Playground

HTML

<input type="text" class="initial-data" value="initial data" />

CSS

input {
    color: #444;
    margin: 10px;
    padding: 5px 10px;
    width: 220px;
}
.initial-data {
    color: #aaa;
    border: 1px solid #c1c1c1;
}

JavaScript

$(function(){
    var defaultInitData = "initial data"
    $("input").focus(function(){
        if ($(this).attr('value') == defaultInitData ) {
            $(this).removeClass('initial-data').attr('value', '');
        }        
    });
    $("input").blur(function(){
        if ($(this).attr('value') == "") {
            $(this).addClass('initial-data').attr('value', defaultInitData );
        }        
    });
})