templates - JQuery Tmpl and Databinding working together -

i trying data binding , tmpls - jquery plugins work well. want use template render data, , data binding hook objects. example:

var items = [{ name: 'barak obama', phone: '555-1212' },              { name: 'george bush', phone: '444-2222'}];  function additems() {     $("mylist").html("");     (var index in items) {         $("#listtmpl").tmpl(items[index]).link(items[index]).appendto("#mylist");     } }; 

with template this:

<script id="listtmpl" type="text/x-jquery-tmpl">     <li>         <input id="name" value="${name}" />         <input id="phone" value="${phone}" />     </li> </script> 

however, have problem want item contain array, , render {{each}}

var items = [{ name: 'barak obama', phone: '555-1212',              kids: [{name: "malia"}, {name: "sasha"}] },              { name: 'george bush', phone: '444-2222'},              kids: [{name: "barbara"}, {name: "jenna"}] }]; 

and template this:

<script id="listtmpl" type="text/x-jquery-tmpl">     <li>         <input id="name" value="${name}" />         <input id="phone" value="${phone}" />         <ul>         {{each kids}}            <li> ${name}         {{/each}}         </ul> 

but how kids names data linked original objects?

you might want @ knockout.js
use jquery templates , it's own binding mechanism.