How to display selected item from object in Kendo UI Treeview

We are using MVVM pattern using typescript and kendo bindings..
So in our view we are populating viewmodel and sending it to the common function which takes the element to bind, viewmodel.

following is my template code
<script id="AvailableKpiTilesTemplate" type="text/html">
<div><span class="treeview-title" data-bind="text: GetString('Summary_Panel_Available_Metrics')"></span> </div>
<div id ="available-tile-tree-view" data-template="treeTemplate" data-role="treeview" data-bind="source: Tiles" ></div>
</script>

<script id="treeTemplate" type="text/x-kendo-template">
# if (item.Selected) { #
<div class='tree-view-item-unselect tree-view-item-select'> #= item.DisplayName #<span class='add-tile'></span></div>
# } else { #
<div class='tree-view-item-unselect'> #= item.DisplayName #</div>
# } #
</script>

If you see my if part, if item.selected == true then you cant select the node.
I have to make change, I don't want to display the node itself.

If I remove the if part, it works fine but when treeview is created it generates <ul></ul> list and nodes which are generated u have blank <li></li>, so the UI get wrong behavior.

In sort, I want to avoid generation of the <li></li>.
any idea?