JSFiddle - React, Tailwind, and code Playground

by Shawn

HTML

<label for="numbers">Numbers: </label>
<input id="numbers" />

JavaScript

var numbers = [],
    nb = 10000,
    i;

for (i = 0; i < nb; i += 1) {
    numbers.push(i.toString());
}

function color (color) {
    $('#numbers').css({
        background: color
    });
}

$("#numbers").autocomplete({
    source: numbers,
    search: function (event, ui) {
        console.log('search event fired');
        color("red");
    },
    open: function (event, ui) {
        console.log('open event fired');
        color("green");
    },
    close: function (event, ui) {
        console.log('close event fired');
        color("white");
    }
});