Dynamically render code with data to dom

In my code, on focus of a textbox I’m checking whether the doc has sub docs or not

If it has some sub docs I want to display those docs in the dom, if those sub docs has other subdocs I want to display those subdocs also it goes on and on infinite times

First I’m diaplying main docs

{{#each usercards}}
	<input type="text" id="{{_id}}" class="inputtitle" >
{{/each}}

on click of this userinput i’m checking it has children or not

      'focus .inputtitle':function(e,tmpl){
		var res=userCards.find({parent_id: this._id}).count();	
           if(res > 0){
             //*^^^^ here I want to insert the below code with data of helper
          }
	},

the code I want to insert to the dom

{{#each allchildcards}}
	<input type="text" id="{{_id}}" class="childtitle"  >
{{/each}}

In the above code for the allchildcards I want to send the cursor and I want to append to the #allcards element in the dom, How to do that?

I thought I can use Blaze.renderWithData but I don’t know how to use it, any help please

Blaze.renderWithData(templateOrView, data, parentNode, [nextNode], [parentView])