Sample: dhtmlxTree Dynamically change icon/text/style dhtmlxTree main page
X

You can customize this JavaScript tree to look just the way you want. Select a tree item you want to edit then click on image or color to make apstdpriate changes. To change tree item's text, type new text in the box and click "Set new item label".

Set new item label 

To change item's image - click on one of next images:

To change item's color - click on one of next colors:
 
 
 
 
 
 
 
 
 
 
<div id="treeboxbox_tree" style="width:200;height:200"></div>
<script>
 
            tree=new dhtmlXTreeObject("treeboxbox_tree","100%","100%",0);
            tree.setImagePath("../imgs/");
            tree.loadXML("tree.xml");
            
            ....
            //set item text
            tree.setItemText(id,"New text");
            //set item images
            tree.setItemImage2(id,"item.gif","closeItem.gif","openItem.gif");
</script>