Conflict dynamic controls in javascript

See more:

Javascript

Kendo-UI

Hi, I have a gridview in which I have 5 columns for example. After the grid is loaded with data from db, I will have the first column designed with a dropdown using jquery. I plan to enhance the second column to become a datetime picker by using jquery too. I have successfully added the dropdown but when I added also the datetime picker, the dropdown will become datetime picker too.
I suspect the jquery is conflict between these 2 setting in the "apppendTo(container)" but would not sure how to change it as I am still newbie in jquery and have search online materials for reference but to no avail. Below are my codes:

grid = $('#gdInformation').kendoGrid($.extend({
      //some setting here
       columns: [
       { field: "Region", title: "Region", width: 120,  editor: regionDropDownEditor},
       { field: "DateStart", title: "Date Start", editor: dateTimeEditor}]
}));

function regionDropDownEditor(container, options) {
    $('<input data-bind = "value: Region" required name"' + options.field + '"/>')
        .appendTo(container)
        .kendoDropDownList({
            dataTextField: "Region",
            dataValueField: "Region",
            dataSource: _regionNames //array containing items
        });
};
function dateTimeEditor(container, options) {
    $('<input data-bind = "value: DateStart" required name"' + options.field + '"/>')
        .appendTo(container)
        .kendoDateTimePicker({
            value: new Date(),
            dateInput: true,
            format: "MM/dd/yyyy HH:mm:ss"
        });
};

I am quite sure the problem is coming from the "appendTo()" but how I need to change it? Thank you.

What I have tried:

1. Change the "appendTo(container)" into "appendTo(options.field)" but to no avail.
2. Search internet for reference but only found the appendTo() basic usage.