Extjs - How to insert / update / delete - child nodes - dynamically

My question is similar to http://www.sencha.com/forum/showthread.php?2916-insert-update-delete-child-nodes-dynamically

The only difference is that I use Ext.Tree. I divided the main page into two parts. I left the left side to display the data in the tree structure and the right side so that some display some details on the screen.

Currently, some child nodes are under root node (Source). When one of the children clicked, I fill in some data on the right side of the screen.

Can someone explain to me how to dynamically update child update nodes (insert / update / delete) when I add or delete data on the right side of the screen, which is a grid.

   Ext.onReady(function() {

    var Tree = Ext.tree;

    var tree = new Tree.TreePanel({
        useArrows: true,
        autoScroll: true,
        animate: true,
        enableDD: true,
        containerScroll: true,
        border: false,
        // auto create TreeLoader
        dataUrl:'[JS Array]',
        root: {
            nodeType: 'async',
            text: 'ALL',
            draggable: false,
            id: ''
        }
    });

    // render the tree
    tree.render('tree-div');
    tree.getRootNode().expand();
});