<button id='show'>Show</button> <button id='hide'>Hide</button> <div id="drawer"> <div>Content area content.</div> </div> <script> $(document).ready(function() { var drawerInstance = $("#drawer").kendoDrawer({ mode: "push", template: `<ul><li data-role='drawer-item'><span class='k-icon k-i-star-outline'></span><span class='item-text'>item 1</span></li><li data-role='drawer-separator'></li><li data-role='drawer-item'><span class='k-icon k-i-twitter'></span><span class='item-text'>item 2</span></li></ul>`, position: 'left' }).data("kendoDrawer"); $('#show').click(function() { drawerInstance.show(); }); $('#hide').click(function() { drawerInstance.hide(); }); }); </script>