I used XTemplate to render my blog post.

Code:
var tpl = new Ext.XTemplate(
            '<tpl for=".">',
            '<div class="row-content-inner">',
            '        <div class="row_profile"><div class="profile_pic"><img src="{photo}" width="50"/></div>{fname}<div class="clear"></div></div>',
            '        <div class="row_message">{message}</div>',
            '        <tpl if="this.isImageEmpty(image_url)">',
            '                <div class="img_post"><div class="img_wrapper"><img src="{image_url}"/></div>{description}</div>',
            '        </tpl>',
            '        <div>',
            '            <tpl for="comments">',
            '                <div id="commentbox">{c_created} - {comment}</div>',
            '            </tpl>',
            '        </div>',
            '</tpl>',
            {
                isImageEmpty: function(image)
                {
                    return image != "";
                }
            }
        );
My goal is to append my text from here <div id="commentbox">.

Here is my attempt in my Controller which is an experiment.

Code:
addComment: function() {


        var tpl = this.getBlogDetails().getTpl();
        
        tpl.insertAfter('#commentbox','test');
}
Nothing works in all my attempts.