下拉列表未显示选中的已加载数据

Question

如果我对下拉列表的数据进行硬编码，那么我可以使用下面的代码显示下拉选项：

HTML

<div class="btn-group" role="group">
    <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
        <span id="make-selected">Make</span> <span class="caret"></span>
    </button>
    <ul class="dropdown-menu" id="make-dropdown">
        <li><a href="#">Oldsmobile</a></li>
        <li><a href="#">Ford</a></li>
        <li><a href="#">Volkswagen</a></li>
        <li><a href="#">Chrysler</a></li>
        <li><a href="#">Pontiac</a></li>
    </ul>
</div>

JS

$('.dropdown-menu a').click(function(){
    $('#make-selected').text($(this).text());
});

我的问题是，如果我从其他来源加载我的数据，那么它将不再显示如下所示的选择。

// the input for this is just a JSON file.
function populateDropdown(jsonData) {
    for (var m in jsonData) {
        $('#make-dropdown').append('<li><a href="#" data-maker="' + jsonData[m] + '">' + jsonData[m] + '</a></li>')
    }
}

$('.dropdown-menu a').click(function(){
    $('#make-selected').text($(this).text());
    console.log("CLICKED" + this);
});

下拉列表会被填充，但一旦我点击选择，就没有任何事情发生。