var autocomplete_inputBox = null; var autocomplete_suggBox = null; var autocomplete_icon = null; var autocomplete_linkTag = null; function applyAutocompleteSearchBar(autocomplete_searchWrapper_selector, suggestions) { autocomplete_searchWrapper = document.querySelector(autocomplete_searchWrapper_selector); autocomplete_inputBox = autocomplete_searchWrapper.querySelector("input"); autocomplete_suggBox = autocomplete_searchWrapper.querySelector(".autocom-box"); autocomplete_icon = autocomplete_searchWrapper.querySelector(".icon"); autocomplete_linkTag = autocomplete_searchWrapper.querySelector("a"); let webLink; // if user press any key and release autocomplete_inputBox.onkeyup = (e)=>{ let userData = e.target.value; //user enetered data let emptyArray = []; if(userData){ autocomplete_icon.onclick = ()=>{ webLink = `https://www.google.com/search?q=${userData}`; autocomplete_linkTag.setAttribute("href", webLink); autocomplete_linkTag.click(); } emptyArray = suggestions.filter((data)=>{ //filtering array value and user characters to lowercase and return only those words which are start with user enetered chars return data.toLocaleLowerCase().includes(userData.toLocaleLowerCase()); }); emptyArray = emptyArray.map((data)=>{ // passing return data inside li tag return data = `