JSFiddle - React, Tailwind, and code Playground

HTML

<input list="browsers" id="fruitId" name="fruitId" onchange="someFunction(this.value)" 					 
						<datalist id="browsers">							 
							  <option data-value="apl">Apple</option>							
                <option data-value="mng">Mango</option>							
                <option data-value="orng">Orange</option>							
						</datalist>

JavaScript

var datalist = document.getElementById ("browsers");
		var input_id = document.getElementById ("fruitId");
		 for (var i=0;i<datalist.options.length;i++){
			if (datalist.options[i].value == input_id.value) 
			{
				document.getElementById("fruitId").value=datalist.options[i].getAttribute("data-value");
        alert(document.getElementById("fruitId").value);
				break;
			}
		 }