jsTree multiple instances.

<!DOCTYPE html>
<html>

  <head>
    <link rel="stylesheet" href="style.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.2.1/themes/default/style.min.css" />
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.1/jquery.min.js"></script>  
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.2.1/jstree.min.js"></script>
    <script src="script.js"></script>
  </head>

  <body>
    <h1>Hello Plunker!</h1>
    <div id="tree-1" style="float: left"></div>
    <div id="tree-2" style="float: left"></div>
    <div id="tree-3"></div>
  </body>

</html>

// Code goes here

$(document).ready(function(){
  var showJsTree = function(selector, cascade) {
    var data = [{
                text: "My Documents ", state: {opened: true}, spriteCssClass: "rootfolder", children: [
                    {
                        text: "UI Project", state: {opened: true}, children: [
                            {  text: "about.html" },
                            {  text: "index.html" },
                            {  text: "logo.png" }
                        ]
                    },
                    {
                         text: "New Web Site", state: {opened: true}, children: [
                            {  text: "mockup.jpg" },
                            {  text: "Research.pdf" },
                        ]
                    },
                    {
                         text: "Reports", state: {opened: true}, children: [
                            {  text: "February.pdf"},
                            {  text: "March.pdf" },
                            {  text: "April.pdf" }
                        ]
                    }
                ]
            }];
    
    $(selector).jstree({
      'plugins': ['checkbox'],
      'core': {
        data: data
      },
      'checkbox': {
      'tie_selection': false,
      'cascade': cascade,
      'three_state': false
      }
    });
  };
  
  showJsTree('#tree-1', 'undetermined');
  showJsTree('#tree-2', 'undetermined+down');
  showJsTree('#tree-3', 'undetermined+down+up');

});

/* Styles go here */