JSFiddle - React, Tailwind, and code Playground

by bigneo

HTML

<label id="color_text">Forename:</label><br />
<input id="f1" class="form-control" type="text" name="forename"    value="Forename" /><br /><br />

JavaScript

var new_id = document.getElementById("f1");

    new_id.onfocus = function(){
        if (new_id.value == "Forename"){
        new_id.value = "";
        }
     };

    new_id.onblur = function() {
        if (new_id.value == ""){
        new_id.value = "Forename"; 
        }
    };