javascript - Dynamically insert content tag -

i want use <content> tag dynamically (on demand).

ex:

parent:

<parent>     <child>         <grand-child></grand-child>     </child> <parent> 

child:

<child>     <content></content> </child> 

the above hierarchy place grand child inside child, want insert content provided parent dynamically.

for ex:

1. grand parent tab
2. child table
3. grand child chart

on clicking on row of table want display chart below row. type of element has passed tab.

is there way achieve this?

what tried:

1. dynamically created content tag using document.createelement("content"); on row click event handler. creates content tag not contents. guess available @ template render time.