JQuery Templates - too much recursion

I am using jquery templates to generate a tree structure to later display as a treeview of sections and items.

The structure of data looks like this, where each section has items and sections and each item can have more sections:

section

    items

        item

            sections

        item

            sections

    sections

        section

            sections

            items



    ...and so on

My templates then recursively call each other:

<script id="my-item-tmpl" type="text/x-jquery-tmpl">

    <li>

        <span>${text}</span>

         <ul>

        {{each sections}}

         {{tmpl($value) "sectionTmpl"}}

        {{/each}}

        </ul>

    </li>

</script>



<script id="my-section-tmpl" type="text/x-jquery-tmpl">

    <li>

        <span>${text}</span>

        <ul>

        {{each items}}

             {{tmpl($value) "itemTmpl"}}

        {{/each}}



        {{each sections}}

             {{tmpl($value) "sectionTmpl"}}

        {{/each}}

        </ul>

    </li>

</script>









$("#my-item-tmpl").template('itemTmpl');

$("#my-section-tmpl").template('sectionTmpl');





$.tmpl('sectionTmpl', { section }).appendTo(this);

I am finding however with around 4 levels into the structure I receive a "too much recursion " error in my console.

Is this just a limitation of the jQuery Template engine?

Edit:

I've resolved this by removing the {{each}} and replacing it with a {{tmpl}} call. The {{each}} was not needed. I have also wrapped each {{tmpl}} call in an {{if}} to ensure the collection exists.

Source: Tips4all