JSFiddle - React, Tailwind, and code Playground

HTML

<input type="text" value="Some text here..." class="populated-text">
<input type="text" value="Any default text you like" class="populated-text">
<input type="text" value="Will be used as empty" class="populated-text">

JavaScript

jQuery(function ($) {
    
    // Removes the defualt text on key press
    function keyDown (e) {
        var input = $(e.target);
        
        if (input && !input.data('data-entered')) {
                input.data('data-entered', true);
                input.val("");
        }
    }
    
    // Restore the default text if empty on blur
    function blur(e) {
        var input = $(e.target);
        
        if (input && input.val() === "") {
                input.data('data-entered', false);
                input.val(input.data('blank-value'));
        }
    }
    
    $('.populated-text').each(function () {
        var input = $(this);
        input.data('blank-value', input.val());
        input.data('data-entered', false);
        input.keydown(keyDown);
        input.blur(blur);
    });
    
});