JSFiddle - React, Tailwind, and code Playground

by RichardAD

HTML

<script src="http://cdn.kendostatic.com/2012.1.322/js/kendo.all.min.js"></script>
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.1.322/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.1.322/styles/kendo.default.min.css">
<div id='datatree'>
</div>

<div id='msg'></div>


<div>
    <ul>
        <li class=k-button id=findbytext>Item 1.1</li>
        <li class=k-button id=findbypath>SelectMe</li>
    </ul>
</div>

JavaScript

$(document).ready(function() {
    function msg(text) {
        $('#msg').append(text + '<br>');
    }

    $('#datatree').kendoTreeView({
        dataSource: [
            {
            text: "Item 1",
            selected: true,
            items: [
                {
                text: "Item 1.1"},
            {
                text: "Item 1.1",
                selected: true},
            {
                text: "Item 1.2"}
            ]},
        {
            text: "Item 2"}
        ],
        select: function(e) {
            msg('selected node:' + $(e.node).find('>div >span.k-in').text());
        }
    });

    var tv = $('#datatree').data('kendoTreeView');

    $('#findbytext').on('click', function() {
        var node = tv.findByText($(this).text());
        tv.select(node);
        tv.expand(node.parentsUntil('.k-treeview'));
        msg(text);
    });



});