title: dojo tree custom icons
body: <p>After reading this and looking at some dojo tree examples, I tried to use my custom icons inside a dojo tree, but only the root item gets changed. Can anyone correct me? The icon is in the same directory as the below HTML file, and shows for the root, but not the leaves. 
  <a href="https://stackoverflow.com/questions/2832200/how-to-change-the-icon-of-leaf-node-in-dojo-tree">how to change the icon of leaf node in dojo tree?</a>
      
  </p>
  
  <pre><code>&lt;head&gt;
      &lt;style type="text/css"&gt;
          body, html { font-family:helvetica,arial,sans-serif; font-size:90%; }
  
          .diagramIcon 
          {
              background-image: url(diagram_16x16.png); 
              background-repeat: no-repeat; 
              background-position: center center; 
              width: 16px; 
              height: 16px;
          }           
  
      &lt;/style&gt;
  
      &lt;script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/dojo/1.5/dojo/dojo.xd.js" djConfig="isDebug:true, parseOnLoad:true"&gt;&lt;/script&gt;
  
      &lt;script type="text/javascript"&gt;
          dojo.require("dojo.data.ItemFileReadStore");
          dojo.require("dijit.Tree");
          dojo.require("dijit.tree.ForestStoreModel");
  
  
          var countries = { identifier: 'abbr', 
            label: 'name',
            items: [
              { abbr:'ec', name:'Ecuador',           capital:'Quito' },
              { abbr:'eg', name:'Egypt',             capital:'Cairo' },
              { abbr:'sv', name:'El Salvador',       capital:'San Salvador' },
              { abbr:'gq', name:'Equatorial Guinea', capital:'Malabo' },
              { abbr:'er', name:'Eritrea',           capital:'Asmara' },
              { abbr:'ee', name:'Estonia',           capital:'Tallinn' },
              { abbr:'et', name:'Ethiopia',          capital:'Addis Ababa' }
          ]};
  
          dojo.addOnLoad(function() {
              var store = new dojo.data.ItemFileReadStore({
                  data: countries,
              });
  
              var treeModel = new dijit.tree.ForestStoreModel({
                  store: store,
                  rootLabel: "Continentwa",
                  //getIconClass: myGetIconClassFunction,
              });
  
              var tree = new dijit.Tree({
                  model: treeModel,
          showRoot: true
              },
              "treeOne");
  
      tree.getIconClass = myGetIconClassFunction;
      tree.startup();
          });
  
          function myGetIconClassFunction(item, opened)
          {
              if(item.root){
                  return "diagramIcon";
              }else{
                                      if (item.children){
                      return "diagramIcon";
                                      }else {
                      return {backgroundColor: "orange"};
                                      }
  
              }
  
          }
  
      &lt;/script&gt;
      &lt;link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/dojo/1.5/dijit/themes/claro/claro.css"/&gt;
  &lt;/head&gt;
  
  &lt;body class=" claro "&gt;
      &lt;div id="treeOne"&gt;
      &lt;/div&gt;  
  &lt;/body&gt;
  </code></pre>
  
  <p></p>
  
  <p>In case there is a better way to implement, please let know. Thanks!!</p>