JSFiddle - React, Tailwind, and code Playground

HTML

<div>
			<input type="text" list="ORG-DHA" id="OrgDHA" placeholder="Select an Organization" onchange="Org1Pick()" />
			<input type="text" list="ORG-DHA" id="OrgDHA2" placeholder="" onchange="Org2Pick()" style="visibility:hidden" />
			<div id="OrgChoice" >No Organization(s) seleceted.</div>
		</div>

		<!-- ORG datalists -->
		<datalist id="ORG-DHA">
			<option value="AFMS">
			<option value="BUMED">
			<option value="MEDCOM">
			<option value="NCR">
		</datalist>
		<datalist id="ORG-DHA-AFMS">
			<option value="ACC">
			<option value="AETC">
			<option value="AFDW">
			<option value="AFGSC">
			<option value="AFMC">
			<option value="AFSOC">
			<option value="AFSPC">
			<option value="AMC">
			<option value="PACAF">
			<option value="USAFE">
		</datalist>
		<datalist id="ORG-DHA-BUMED">
			<option value="DET JAX">
			<option value="NME">
			<option value="NMW">
		</datalist>
		<datalist id="ORG-DHA-MEDCOM">
			<option value="ERMC">
			<option value="MRMC">
			<option value="NRMC">
			<option value="PRMC">
			<option value="SRMC">
			<option value="USAPHC">
			<option value="WRMC">
		</datalist>
		<datalist id="ORG-DHA-NCR">
			<option value="UHUHS">
			<option value="WRNMMC Bethesda">
		</datalist>

JavaScript

function Org1Pick() {
			var Org1 = document.getElementById("OrgDHA").value;
			document.getElementById("OrgDHA2").style.visibility = "visible";
			document.getElementById("OrgChoice").innerHTML = Org1+" selected";
			switch (Org1) {
				case "AFMS":
					document.getElementById("OrgDHA2").list = "ORG-DHA-AFMS";
					document.getElementById("OrgDHA2").placeholder = "DHA-AFMS";
					break;
				case "BUMED":
					document.getElementById("OrgDHA2").list = "ORG-DHA-BUMED";
					document.getElementById("OrgDHA2").placeholder = "DHA-BUMED";
					break;
				case "MEDCOM":
					document.getElementById("OrgDHA2").list = "ORG-DHA-MEDCOM";
					document.getElementById("OrgDHA2").placeholder = "DHA-MEDCOM";
					break;
				case "NCR":
					document.getElementById("OrgDHA2").list = "ORG-DHA-NCR";
					document.getElementById("OrgDHA2").placeholder = "DHA-NCR";
					break;
				default:
					document.getElementById("OrgDHA2").style.visibility = "hidden";
					document.getElementById("OrgAFMS").style.visibility = "hidden";
					document.getElementById("OrgBUMED").style.visibility = "hidden";
					document.getElementById("OrgMEDCOM").style.visibility = "hidden";
					document.getElementById("OrgNCR").style.visibility = "hidden";
			}
		}