jquery - Kendo UI - MultiSelect は、外部ファイルから動的に作成された dataSource を置き換えます

Question

Kendo UI MultiSelect dataSource 値を外部 .js ファイルから置き換えるにはどうすればよいですか...

PSindex.html : 実際の値は、以下のようなファイルから取得されます。

index.html

<select multiple="multiple" class="city_fields initi-select-218" id="test">
</select>

var data = [
     "New Jersey",
     "San Francisco",
     "Las Vegas",
     "Chicago",
     "Los Angeles",
     "New York"
];

jQuery(".city_fields").kendoMultiSelect({
  dataSource: data,
  filter: "contains",
});

上記の値は、以下のように init.js (外部) ファイルから置き換えようとしています...

init.js

オプション1を試しました：

var newData = ["Delhi",  "Bangalore"];
jQuery(".initi-select-218").kendoMultiSelect({
    dataSource: newData,
    filter: "contains",
    placeholder: "Select",
});

オプション2を試しました：

var newData = ["Delhi", "Bangalore"];
$("#test").kendoMultiSelect({
    dataSource: newData,
    filter: "contains",
    placeholder: "Select",
}); 
$("#test").setDataSource(new kendo.data.DataSource({ data: newData }));

オプション3を試しました：

var newData = ["Delhi",  "Bangalore"];
var multiselect = $("#test").data("kendoMultiSelect");
multiselect.setDataSource(new kendo.data.DataSource({ data: newData }));

オプション 2 と 3 の場合、次のようなエラーが発生します。

Uncaught TypeError: $(...).setDataSource is not a function...

それでも、index.htmlファイルから値を取得しています