JSFiddle - React, Tailwind, and code Playground

by Reigel Gallarde

HTML

<link rel="stylesheet" href="http://jqueryui.com/themes/base/jquery.ui.all.css">
<input name="category" />

JavaScript

function cat_autocomplete(){
    var categoryTags = ["boots>black","boots>brown>boys>blue","clothes>small_men>scarfs>blue","boots","boots>brown>boys","boots>brown","ties>casual","clothes","coats","clothes>girls","boots>brown>girls","clothes>small_men>hats","jackets","clothes>mens","clothes>red","boots>brown>red","clothes>small_men>scarfs","shoes","clothes>small_men","ties>smart","ties","clothes>womens"];
    $( "input[name=category]" ).autocomplete({
        source: categoryTags
    });
}
function prod_autocomplete(){
    var productTags = ["clothes>small_men>hats","boots>black","clothes>small_men>hats","clothes>small_men>hats","clothes>small_men>hats","clothes>small_men>hats","clothes>small_men>hats","clothes>small_men","clothes>small_men>hats","clothes>small_men>hats","clothes>small_men>hats","clothes>small_men>hats","clothes>small_men>hats","clothes>mens","clothes>small_men","clothes>small_men>hats","clothes>small_men>hats","clothes>small_men>hats","clothes>small_men>hats","clothes>small_men>hats"];
    $( "input[name=product]" ).autocomplete({
        source: productTags
    }); 
}
$(document).ready(function(){
    prod_autocomplete();
    cat_autocomplete();
});