JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.1.229/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.1.229/styles/kendo.default.min.css">
<script src="http://cdn.kendostatic.com/2012.1.229/js/kendo.all.min.js"></script>
<script type="text/x-kendo-tmpl" id="template">
    <div class="order">
        <button class="k-button">click</button>        
    </div>        
</script>

<div id="listView"></div>

CSS

.order
{
    float: left;
    width: 270px;
    height: 200px;
    margin: 10px;
    padding: 5px;
}

.k-listview 
{
    border: 0;
    padding: 0 0 20px 0;
    min-width: 0;
}

JavaScript

$("#listView").kendoListView({
    dataSource: {
        type: "odata",
        transport: {
            read: "http://demos.kendoui.com/service/Northwind.svc/Employees"
        },        
        pageSize: 2,
        serverPaging: true        
    },
    selectable: true,
    change: function() { 
        console.log("change");
    },
    template: kendo.template($("#template").html()),       
})
    .delegate(".k-button", "mousedown", function(e) {       
        e.stopPropagation();
        console.log("mouse down");
    });