Highlight treeview nodes

Highlight treeview nodes, kendoUI

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">
<label for='search-term'>Search </label><input type=text id='search-term'/>
<div id='searchable-tree'></div>

CSS

span.k-in > span.highlight {background:yellow}

JavaScript

/* Highlight treeview nodes, basis: kendoUI 1.322, jQuery1.7.1 */

$('#search-term').on('keyup', function () {

    $('span.k-in > span.highlight').each(function(){
        $(this).parent().text($(this).parent().text());
    });
  
    // ignore if no search term
    if ($.trim($(this).val()) == '') { return; }

    var term = this.value.toUpperCase();
    var tlen = term.length;

    $('#searchable-tree span.k-in').each(function(index){
        var text = $(this).text();
        var html = '';
        var q = 0;
        while ((p = text.toUpperCase().indexOf(term,q)) >= 0) 
        {
            html += text.substring(q,p) + '<span class="highlight">' + text.substr(p,tlen) + '</span>';
            q = p + tlen;
        }
        
        if (q > 0) {
            html += text.substring(q);
            $(this).html(html);
            
            $(this).parentsUntil('.k-treeview').filter('.k-item').each(
                function (index,element) {
                    tv.expand($(this));
                    $(this).data('search-term',term);
                }
            );
        }
    });

    $('#searchable-tree .k-item').each(function(){
        if ($(this).data('search-term') != term) {
            tv.collapse($(this));
        }
    });
}) ;


$('#searchable-tree').kendoTreeView(
dataSource = [
    {
    text: "Item 1 - Repeatable Beats",
    items: [
        { text: "Item 1.1 - Landing in the Sandbox"} ,
        { text: "Item 1.2 - Lampoon the Moon, Sunlamp"}
    ]},
    {
    text: "Item 2"
    },
    {
    text: "Months",
    items: [
        { text: "January"},
        { text: "February"},
        { text: "March"},
        { text: "April",
          items: [
              { text: 'Rain'},
              { text: 'Sleet'},
              { text: 'Sunshine'},
              { text: 'Wind'}
        ]},
        { text: "May"},
        { text: "June"},
        { text: "July"},
        { text: "August"},
        { text: "September",
          items: [
             ...