JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://cdn.rawgit.com/LeaVerou/awesomplete/gh-pages/awesomplete.css">
<script src="https://cdn.rawgit.com/LeaVerou/awesomplete/gh-pages/awesomplete.min.js"></script>
<input type="text" id="countries" />
<input type="button" onclick="opens()" value="Open" />
<input type="button" onclick="close()" value="Close" />
<input type="button" onclick="next()" value="Next" />
<input type="button" onclick="previous()" value="Previous" />
<input type="button" onclick="selects()" value="Select" />
<input type="button" onclick="evaluates()" value="Evaluate" />

JavaScript

var input = document.getElementById("countries");
var awesomplete = new Awesomplete(input, {minChars: 1, maxItems: 10, autoFirst: true});

awesomplete.list = ["India", "Russia", "USA", "China", "Japan", "UK", "France"];

function opens()
{
    awesomplete.open();
}

function close()
{
    awesomplete.close();
}

function next()
{
    awesomplete.next();
}

function previous()
{
    awesomplete.previous();
}

function selects()
{
    awesomplete.select();
}

function evaluates()
{
    awesomplete.list = ["India", "Russia", "USA", "China", "Japan", "UK", "France", "Australia"];
    awesomplete.evaluate();
}