JSFiddle - React, Tailwind, and code Playground

by keif

HTML

<div id="inputs">
    <input type="text" value="Your Name 1" />
    <input type="text" value="Your Name 2" />
    <input type="text" value="Your Name 3" />
    <input type="text" value="Your Name 4" />
</div>

JavaScript

(function($){
    $('#inputs input[type=text]').each(function(i, el){
            var $el = $(el);
            var value = $el.val();
            $el
                .focus(function(e){
                    if ($el.val() === value) {
                        $el.val('');
                    }
                })
                .blur(function(e){
                    if ($el.val() === '') {
                        $el.val(value);
                    }
                });
        });
})(jQuery);