动态创建的下拉列表无法在Chrome中打开

Question

我使用jquery创建了一个动态下拉列表。此下拉列表将根据特定条件绑定到kendo网格列。请参阅以下代码

 CreateDropDown: function (e, grid, defaultvalue) {
 var field = $("#" + grid).data("kendoGrid").columns[e.index()].field;
 $("#" + field).hide();
 var kendoddl = $("<input id='DDL'  />");
 e.append(kendoddl);       
 $("#DDL").find('select').append( $("#DDL").kendoDropDownList({
     dataTextField: 'LevelName',
     dataValueField: 'Levelvalue',
     index: 0,
     change: LocalSetup.LevelOnSelect,
     dataSource: {
         transport: {
             read: {
                 url: "/ONT/TYK/GetDropDowndata"
             }
         },
         serverFiltering: true
     },
 })
);
var value = LocalSetup.checkLevelValue(defaultvalue);
var dropdownlist = $("#DDL").data("kendoDropDownList");
dropdownlist.value(value);
},

从IE浏览时，代码工作正常。但问题出在Chrome中。下拉列表未打开并显示选项。请建议。