JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://cdn.kendostatic.com/2014.3.1411/js/kendo.all.min.js"></script>
<link rel="stylesheet" href="http://cdn.kendostatic.com/2014.3.1411/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2014.3.1411/styles/kendo.default.min.css">
<div id="grid"></div>
<input id="places" />

JavaScript

$(function () {
    var grid = $("#grid").kendoGrid({
        dataSource: new kendo.data.DataSource({
            data: [{
                FirstName: "Bob",
                PlacesLived: ["Tampa", "Charlotte", "London"]
            }, {
                FirstName: "Rick",
                PlacesLived: ["Seattle", "London"]
            }]
        }),
        height: 150,
        filterable: true,
        filter: {
            logic: "and",
            filters: []
        },
        columns: ["FirstName"]
    }).data("kendoGrid");

    $("#places").kendoDropDownList({
        dataSource: ["Seattle", "London", "Charlotte", "Tampa"],
        optionLabel: "Filter by City",
        change: function () {
            var val = this.value();
            grid.dataSource.filter({
                field: "PlacesLived",
                operator: function (items, selected) {
                    return items && items.some(function (x) {
                        return x === val;
                    });
                },
                value: function () { }
            });
        }
    });

});