title: Jstree - extra classes added to the node getting lost upon collapsing
body: <p>I am creating a permission based knockout JS jsTree where i pull in the tree data from an observableArray. I want to add/revoke permission to folder and sub-folder upon clicking as well as based on the JSON upon page load. But since the tree is re-rendering every single time upon collapsing, the added classes are getting lost. I have added an extra sprite image with a close icon to the existing sprite and change the sprite position upon clicking.
  ( Cannot post the screenshot because i dont have the minimum reputation to post images ). There can be deep nesting for the folders as well.</p>
  
  <p>Current jsTree ( where X indicates the new folder icon )</p>
  
  <pre><code>-X Reports library
    - X Archives
  - My Reports
  </code></pre>
  
  <p>/* Upon collapsing and expanding again: */</p>
  
  <pre><code> -X Reports library
     - Archives
   - My Reports
  </code></pre>
  
  <p>The initial knockout js tree has been done using a variant of this <a href="http://jsfiddle.net/u4a7k5zu/20/" rel="nofollow">fiddle</a></p>
  
  <p>Upon page load, i need to set the icons based on the permissions(true/false) in JSON.I can add a permission:true attribute to the json as well.  Also, i need to toggle a folder and that folder along with its sub-folder should toggle the folder icons indicating that the permission is revoked.</p>
  
  <pre><code>self.tree.on("changed.jstree", function (e, data) {
      var node = self.tree.jstree().get_selected(true)[0]; //get current selected node    
  
          var selId = "#"+ node.a_attr.id;
          $(selId).toggleClass("permission-icon");
          var nextItem = $(selId).next();
          var nextListItemFlag = $(selId).next().hasClass("jstree-children");
  
          if(nextListItemFlag){
              $(nextItem).children().each(function(){ 
                  $(this).find(".jstree-icon.jstree-themeicon").toggleClass("custom-permission-icon");
              });             
          }
  
      if (typeof node !== 'undefined') {
          self.isNodeSelected(true);
          self.selectedNode(node);
          self.myinfo(node.original.folderdata);                      
          } else {
          self.isNodeSelected(false);
      }
  });
  
  self.treeData = ko.observableArray(
  [{
      'id': 1,
      'parent': '#',
      'text': 'Reports Library',
      'state': {
          selected: false         
      },
      'type': '#',        
      'folderdata': [{name: "Reports", type: "folder", modified: "07-02-2015", size: "10 KB"},
                     {name: "New text doc", type: "text", modified: "07-02-2015", size: "20 KB"},
                     {name: "test.pptx", type: "pptx", modified: "07-02-2015", size: "39 KB"},
                     {name: "test.xlsx", type: "excel", modified: "07-02-2015", size: "50 KB"}
                    ],
  
      }, {
      'id': 2,
      'parent': '#',
      'text': 'Reports Archive',      
      'type' : '#',
      'folderdata': [{name: "Meetings", type: "folder", modified: "07-02-2015", size: "10 KB"},
                     {name: "logs", type: "text", modified: "07-02-2015", size: "20 KB"},
                     {name: "sessions", type: "pptx", modified: "07-02-2015", size: "39 KB"},
                     {name: "worklog", type: "excel", modified: "07-02-2015", size: "50 KB"}
                    ],
      }, {
      'id': 'dog',
      'parent': 1,
      'text': 'Reports',      
      'type' : 'folder'
  }]
  </code></pre>
  
  <p>Any help will be greatly appreciated! Has been stuck on this thing for a day now :(</p>