JSFiddle - React, Tailwind, and code Playground

HTML

<div id="parent">
    <input type="text" id="search" />
</div>

CSS

.sb-list {
    position: absolute;
    width: 250px;
    top: 0;
    left: 0;
    height: 300px;
    background: #FAFAFA;
    border: solid 1px #999;
    border-top: none;
    display: none;
    overflow: auto;
    z-index: 92592;
    -webkit-box-shadow: 0 2px 2px #999999;
    -moz-box-shadow: 0 2px 2px #999999;
    -ms-box-shadow: 0 2px 2px #999999;
    box-shadow: 0 2px 2px #999999;
}

JavaScript

var search = {
    closing: null,
    performSearch: function (elem, e) {
        $('#search-results').remove();
        var $this = $(elem);
        var $target = $('#search');
        $target = $('<div id="search-results" class="sb-list"></div>');
        $target.insertAfter($this);
        var p = $this.position();
        $target.css('top', (p.top + $this.height() + 15) + 'px');
        $target.css('width', ($this.width() + p.left + 10) + 'px');
        $target.css('width', ($this.width() + 25) + 'px');
        $target.css('left', (p.left) + 'px');
        $target.slideDown('fast', function () {
            $target.css('overflow', 'auto');
        });
        $target.on('mouseover', '.sb-row', function () {
            $(elem).addClass('sb-active');
            $('.sb-active').removeClass('sb-active');
        });
        $target.on('click', '.sb-row', search.click);
        //$target.parent().on('focusin focusout', search.listFocus);

        for (i = 0; i < 40; i++) {
            var html = [];
            html.push('<div class="sb-row' + (i == 0 ? ' sb-active' : '') + '">');
            html.push('<a href="#">test result' + i + '</a>');
            html.push('</div>');

            var $out = $(html.join(''));
            $target.append($out);
        }
    },
    delayClose: function (e) {
        console.log('delayClose');
        var self = this;
        console.log('results focused: ' + $('#search-results').is(':focus'));
        console.log('div focused: ' + $('#parent').is(':focus'));
        search.closing = window.setTimeout(function () {
            search.close.apply(self, arguments);
        }, 1000);
    },
    listFocus: function (e) {
        console.log(e.type);
        var self = this;
        window.clearTimeout(search.closing);
    },
    close: function (e) {
        console.log('closing');
        window.clearTimeout(search.closing);
        var $this = $(this);
        $('#search-results').slideUp('fast');
   ...