<!-- required files -->
<link href="../assets/plugins/jstree/dist/themes/default/style.min.css" rel="stylesheet" />
<script src="../assets/plugins/jstree/dist/jstree.min.js"></script>

<!-- html -->
<div id="jstree-drag-and-drop"></div>

<script>
  $("#jstree-drag-and-drop").jstree({
    "plugins": ["contextmenu", "dnd", "state", "types"],
    "core": {
      "themes": { "responsive": false },
      "check_callback": true,
      "data": [{
          "text": "Parent Node",
          "children": [{
            "text": "Initially selected",
            "state": { "selected": true }
          }, {
            "text": "Folder 1"
          }
        },
        "Another Node"
      ]
    },
    "types": {
      "default": { "icon": "fa fa-folder text-warning fa-lg" },
      "file": { "icon": "fa fa-file text-warning fa-lg" }
    },
    "state": { "key": "demo2"  }
  });
</script>