JSFiddle - React, Tailwind, and code Playground

by ilyasahmed195

HTML

<input type="text" data-hint="Enter your Relation Number" />
<input type="text" data-hint="Enter your E-mail Here" /><p></p>
<select name="Select your Policy Number" onchange='checkvalue(this.value)'> 
    <option>Select your Policy Number</option>  
    <option value="Trade Union Coop ins Co">Trade Union Coop ins Co</option>
    <option value="RSA-Al Alaimiya Co">RSA-Al Alaimiya Co</option>
    <option value="Gulf General Coop ins Co">Gulf General Coop ins Co</option>
      <option value="ACE Coop ins Co">ACE Coop ins Co</option>
         <option value="Buruj Coop ins Co">Buruj Coop ins Co</option>
</select> 
<select name="" onchange='checkvalue(this.value)'> 
    <option> </option>  
    <option value="41">41</option>
    <option value="42">42</option>
    <input type="text" data-hint="MED" />
   
    <select name="" onchange='checkvalue(this.value)'> 
    <option> </option>  
    <option value="2011">2011</option>
    <option value="2012">2012</option>
 <input type="text" data-hint="Policy Serial" />
        <Select name="Select Country of Treatment"on change='checkvalue(this.value)'>
<option value="Select Country of Treatment">Select Country Of Treatment</option>
  <option value="AF">Afghanistan</option>
  <option value="AL">Albania</option>
  <option value="DZ">Algeria</option>
  <option value="AS">American Samoa</option>
  <option value="AD">Andorra</option>
  <option value="AO">Angola</option>
  <option value="AI">Anguilla</option>
  <option value="AQ">Antarctica</option>
  <option value="AG">Antigua and Barbuda</option>
  <option value="AR">Argentina</option>
  <option value="AM">Armenia</option>
  <option value="AW">Aruba</option>
  <option value="AU">Australia</option>
  <option value="AT">Austria</option>
  <option value="AZ">Azerbaidjan</option>
  <option value="BS">Bahamas</option>
  <option value="BH">Bahrain</option>
  <option value="BD">Bangladesh</option>
  <option value="BB">Barbados</option>
  <option value="BY">Belarus</option>
  <option...

JavaScript

var inputs = document.getElementsByTagName('input');

for (i=0; i<inputs.length; i++){
    if (inputs[i].hasAttribute('data-hint')){
        inputs[i].value = inputs[i].getAttribute('data-hint');
            inputs[i].style.color = '#999';
        
        inputs[i].onclick = function(){
            this.value = '';
        };
        inputs[i].onblur = function(){
            if (this.value == '' || this.value == this.getAttribute('data-hint')){
                this.value = this.getAttribute('data-hint');
                this.style.color = '#000';
            }
        };
    }
}