JSFiddle - React, Tailwind, and code Playground

HTML

List: <br/>
<label for="autocomplete2">Select a programming language: </label>
<input id="autocomplete2">

<p></p>
Map: <br/>
<label for="autocomplete">Select a programming language: </label>
<input id="autocomplete">

<p></p>
Map with search: <br/>
<label for="autocomplete1">Select a programming language: </label>
<input id="autocomplete1">
<p></p>
<br/><br/>

search for : <b> "c++", "java", "php", "coldfusion", "javascript", "asp", "ruby" </b> for first and second list<br/><br/>
search for : <b> 9RT </b> for third list<br/>

JavaScript

$(document).ready(function(){

var v= [ "c++", "java", "php", "coldfusion", "javascript", "asp", "ruby" ];

var v1 = {"status":"success","data":{"9RT2E":"9RT2E","9RT3E":"9RT3E - in use","9RT4E":"9RT4E","9RT6E":"9RT6E","9RT7E":"9RT7E","9RT8E":"9RT8E","9RT9E":"9RT9E","9RTAE":"9RTAE","9RTBE":"9RTBE","9RTCE":"9RTCE","9RTDE":"9RTDE","9RTEE":"9RTEE","9RTFE":"9RTFE","9RTGE":"9RTGE","9RTHE":"9RTHE","9RTIE":"9RTIE","9RTJE":"9RTJE","9RTKE":"9RTKE","9RTLE":"9RTLE","9RTME":"9RTME","9RTNE":"9RTNE","9RTPE":"9RTPE","9RTQE":"9RTQE","9RTRE":"9RTRE","9RTTE":"9RTTE","9RTUE":"9RTUE","9RTVE":"9RTVE","9RTWE":"9RTWE","9RTXE":"9RTXE","9RTYE":"9RTYE","9RTZE":"9RTZE"}};

$( "#autocomplete2" ).autocomplete({
	source : v
});

$( "#autocomplete" ).autocomplete({
	
	source: function(request, response) { 
		response($.map(v, function (itemKey, itemValue) {
			return {
				label: itemKey,
				value: itemKey
			};
		}));
	}	
                 					
});

$( "#autocomplete1" ).autocomplete({
								
                                source: function(request, response) {
									var re = $.ui.autocomplete.escapeRegex(request.term);									
									var matcher = new RegExp( "n*" + re + "n*", "i");	
									var arrayKey = $.map(v1.data, function (itemKey, itemValue) {
										return itemKey
									});	
									var arrayValue = $.map(v1.data, function (itemKey, itemValue) {
										return itemValue
									});	
									var key = $.grep( arrayKey, function(item,index){										
										return matcher.test(item);
									});	
									var value = $.grep( arrayValue, function(item,index){										
										return matcher.test(item);
									});	
									
									var s = "{";
									for (var i =0; i< key.length; i++) {
										if (i < value.length) {
											s+= "\"" + value[i] + "\":\"" + key[i] + "\",";
										}										
									}		
									s = s.substring(0, s.length-1);
									s += "}";
									
									var jsonObject = jQuery.parseJSON(s);				
									
          ...