Node.js Live Search с выпадающими результатами

Question

Я пытаюсь создать функцию поиска в режиме реального времени, которая будет отображать результаты в качестве пользовательских типов.В настоящее время у меня есть работающий бэкэнд, и я пытаюсь выяснить рендеринг внешнего интерфейса.

В настоящее время у меня есть панель поиска, встроенная в боковую панель, где я хочу отображать результаты в виде выпадающего меню под панелью поиска.

Панель поиска

<form class="form-inline-search" onsubmit="return getSearchResults();">
    <div class="form-group sidebar-search">
        <div class="input-group">
            <input id="searchInput" aria-label="Search" class="form-control search" placeholder="Search for..." type="text" onkeypress="liveSearch()">
            <span class="input-group-btn">
                <button id="searchButton" aria-label="searchButton" class="btn btn-default search" type="submit"><span class="glyphicon glyphicon-search"></span></button>
            </span>
            <div class="dropdown">
                <div class="dropdown-toggle" id="togLiveResults" data-toggle="dropdown">
                    <ul class="dropdown-menu" id="liveResults" aria-labelledby="liveResults"></ul>
                </div>
            </div>
        </div>
    </div>
</form>

Я могу добавить результаты из базы данных в качестве параметров списка в моей функции, однако не могу получить раскрывающийся список появиться с тем, что у меня есть.Другими словами, раскрывающийся список не отображается на странице, хотя он заполнен.

Javascript

...
success: function(result) {
    $("#liveResults").empty();

    var options = '';
    for (var i = 0; i < result.length; i++) {
        options += "<li>" + result[i].name + "</li>";
    }
    $("#liveResults").append(options);

    if ($('#liveResults').is(":hidden")) {
        $('#togLiveResults').dropdown('toggle');
    }
},
...

По какой причине я не могу сделатьвыпадающий список с видимыми результатами, есть ли еще что-то, чего я пропускаю?

JSFiddle для примера.

Решено У меня был неверныйвложение для некоторых объектов DOM.Изменение выпадающего списка на следующее исправило мою проблему:

<div class="dropdown">
    <div class="dropdown-toggle" id="togLiveResults" data-toggle="dropdown"></div>
    <ul class="dropdown-menu" id="liveResults" aria-labelledby="liveResults"></ul>
</div>