JSFiddle - React, Tailwind, and code Playground

HTML

<input name="txtTest"  type="text" id="txtTest" onkeyup="CheckKey(event)"/>

<select onchange="SubstanceChangeHandler(this.value);">
  <optgroup label="Alkaline Metals">
    <option>Lithium (Li)</option>
    <option>Sodium (Na)</option>
    <option>Potassium (K)</option>
  </optgroup>
  <optgroup label="Halogens">
    <option>Fluorine (F)</option>
    <option>Chlorine (Cl)</option>
    <option>Bromine (Br)</option>
  </optgroup>
</select>

JavaScript

function CheckKey(e)
{
    var code = e.keyCode ? e.keyCode : e.which;
    if(code === 13)
    {
      alert("You press Enter key.");
    }            
}

function SubstanceChangeHandler(val)
{
  alert("New substance chosen: "+val);
  txtTest.value= val;
}