创建一个可编辑的下拉菜单，并从外部JS填充它

我想做一个可编辑的下拉菜单，并在数据的双击下拉菜单应该出现，并使填充选项从和外部JS，这应该使运行不止一次。下面是这个

<div class="tabbable">
    <div class="tab-content">
        <div class="tab-pane active" id="tab1">
            <table id='table-draggable1'>
                <tbody class="connectedSortable">
                    <tr>
                        <th>col1</th>
                        <th>col2</th>
                        <th>col3</th>
                        <th>col4</th>
                    </tr>
                    <tr>
                        <td>156</td>
                        <td>668</td>
                        <td>100.95</td>
                        <td class="master">100.95</td> //editable dropdown
                    </tr>
                    <tr>
                        <td class="desc">256</td>
                        <td>668</td>
                        <td>100.95</td>
                        <td class="master">100.95</td> // ondblclick should be editable
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
</div>

jquery，我尝试使下拉菜单可编辑

    $document.ready(function ()
        {
dropdown();
            $(function ()
            {
                $(".master").dblclick(function (e)
                {
                    e.stopPropagation();
                    var currentEle = $(e.target);
                    var value = $(e.target).html();
                    console.log($(e.target));
                    if ($.trim(value) === "")
                    {
                        $(currentEle).data('mode', 'add');
                    }
                    else
                    {
                        $(currentEle).data('mode', 'edit');
                    }
                    updateVal(currentEle, value);
                });
            });
            function updateVal(currentEle, value)
            {
                $(currentEle).html("<select class='master'></select>");
                var mode = $(currentEle).data('mode');
                alert(mode);
                $(".master").focus();
                $(".master").keyup(function (event)
                {
                    if (event.keyCode == 13)
                    {
                        $(this).parent().html($(this).val().trim());
                        $(".master").remove();
                    }
                });
            }
            $(document).click(function (e)
            {
                if ($(".master") !== undefined)
                {
                    if ($(".master").val() !== undefined)
                    {
                        $(".master").parent().html($(".master").val().trim());
                        $(".master").remove();
                    }
                }
            });
        }
        function dropdown()
        {
           var resp = "<option>" + 1 + "</option>"; //this should be populated in dropdown
           $(".master").html(resp);
        }
    }
    });