title: Kendo UI for loop data binding
body: <p>I have such  a code in my project: </p>
  
  <pre><code>&lt;script id="menuTemplate" type="text/x-kendo-template"&gt;
     # for(var i=0; i &lt; menus.menu.length; i++){ # 
     &lt;li id="menu-#= i#" data-bind="events: {click: menuClick}" class="menu-item"&gt;
         &lt;div&gt;#= menus.menu[i].name #&lt;/div&gt;
     &lt;/li&gt;  
     # } #
  &lt;/script&gt;
  &lt;div data-role="view" id="menuPage" data-model="menuViewModel"&gt;
      &lt;ul id="menuListView" data-role="listview" data-template="menuTemplate" data-bind="source: dataSource"&gt;&lt;/ul&gt;
  &lt;/div&gt;
  
  &lt;script&gt;
    $(document).ready(function(){
    var dataSource = new kendo.data.DataSource({
      transport: { 
          read: { 
              url: "data/test.json", 
              dataType: "json", 
          },
      },
      schema: {
          data: function(data) {   
              return data;
          }
      },
  });
  
  var menuViewModel = kendo.observable({
      dataSource: dataSource,
      menuClick: function(e) {
          alert(e);
      }
  });
  kendo.bind($(document.body), menuViewModel); 
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>So I have listview Items and I want bind clicks on them. 
  The problem is that click binds only to the first element of the listview, so alert fires only when I click to the element with the "menu-0" id.
  What I write wrong and how bind the handler properly so menuClick function will be handler for all listview items?</p>
  
  <p>Thanks in advance!</p>