<div id="view">
    <div data-template="ul-template" data-bind="source: items" >
</div>

    <script  id="ul-template" type="text/x-kendo-template">        
        <h3>#=NAME#</h3>
        <ul data-template="il-template" data-bind="source: ad">
            
        </ul>
    </script>

    <script id="il-template" type="text/x-kendo-template">
        <li> #=ATT_NAME#</li>      
    </script>

var model = {items: [
            { NAME: "Group 1", ID: 1, ad: [{ ATT_NAME: "Attribute 1" }, { ATT_NAME: "Attribute 2" }] },
            { NAME: "Group 2", ID: 2, ad: [{ ATT_NAME: "Attribute 3" }, { ATT_NAME: "Attribute 4" }] },
            { NAME: "Group 3", ID: 3, ad: [{ ATT_NAME: "Attribute 5" }, { ATT_NAME: "Attribute 6" }] },
            { NAME: "Group 4", ID: 3, ad: [{ ATT_NAME: "Attribute 7" }, { ATT_NAME: "Attribute 8" }] }
]};

kendo.bind($('#view'), model);

<div id="view">
    <div data-template="ul-template" data-bind="source: items">        
        <h3>Group 1</h3>
        <ul data-template="il-template" data-bind="source: ad">
        <li> Attribute 3</li>      
    
        <li> Attribute 4</li>      
    </ul>
            
        <h3>Group 2</h3>
        <ul data-template="il-template" data-bind="source: ad">
        <li> Attribute 7</li>      
    
        <li> Attribute 8</li>      
    </ul>
            
        <h3>Group 3</h3>
        <ul data-template="il-template" data-bind="source: ad">
            
        </ul>
            
        <h3>Group 4</h3>
        <ul data-template="il-template" data-bind="source: ad">
            
        </ul>
    </div>

    <script id="ul-template" type="text/x-kendo-template">        
        <h3>#=NAME#</h3>
        <ul data-template="il-template" data-bind="source: ad">
            
        </ul>
    </script>

    <script id="il-template" type="text/x-kendo-template">
        <li> #=ATT_NAME#</li>      
    </script>
</div>