JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="//cdn.kendostatic.com/2015.1.429/styles/kendo.common.min.css">
<script src="//cdn.kendostatic.com/2015.1.429/js/kendo.all.min.js"></script>
<link rel="stylesheet" href="//cdn.kendostatic.com/2015.1.429/styles/kendo.bootstrap.min.css">
<table>
    <tr>
        <td>
            <div id="lockdiv1">combo
                <br />
                <select id="combo1">
                    <option value="1" selected="selected">First</option>
                    <option value="2">Second</option>
                    <option value="3">Third</option>
                </select>
            </div>
        </td>
        <td>buttons
            <br>
            <input type="button" id="button1" value="lock combo for 3 seconds" />
            <br>
            <input type="button" id="button2" value="lock body for 3 seconds" />
            <br>
            <input type="button" id="button3" value="lock div for 3 seconds" />
        </td>
    </tr>
</table>

JavaScript

var ui = {};

ui.combo1 = $('#combo1').kendoDropDownList({}).data("kendoDropDownList");

ui.btn1 = $('#button1').kendoButton({
    click: function () {
        kendo.ui.progress(ui.combo1.wrapper, true);
        setTimeout(function () {
            kendo.ui.progress(ui.combo1.wrapper, false);
        }, 3000);
    }
}).data("kendoButton");

ui.btn2 = $('#button2').kendoButton({
    click: function () {
        var sel = $(document.body);
        kendo.ui.progress(sel, true);
        setTimeout(function () {
            kendo.ui.progress(sel, false);
        }, 3000);
    }
}).data("kendoButton");

ui.btn3 = $('#button3').kendoButton({
    click: function () {
        var sel = $('#lockdiv1')
        kendo.ui.progress(sel, true);
        setTimeout(function () {
            kendo.ui.progress(sel, false);
        }, 3000);
    }
}).data("kendoButton");