Bootstrap 5 Tree View is a very simple plug-in for creating a basic and elegant Treeview using BS5.

For use with bootstrap 5, the attributes have been changed from data-target and data-toggle to data-bs-target and data-bs-toggle syntax.

Must Read: Vue Treeview Structure Implementation In Javascript Dynamically

1. Add the following resources for bootstrap-treeview.

<!-- Required Stylesheets -->
<link href="bootstrap.css" rel="stylesheet">

<!-- Required Javascript -->
<script src="jquery.js"></script>
<script src="bstreeview.js"></script>

2. The component will bind to any existing DOM element.

<div id="tree"></div>

3. The basic usage looks like this.

function getTree() {
  // Some logic to retrieve, or generate tree structure
  return data;
}

$('#tree').bstreeview({ data: getTree() });

4. In order to define the desired hierarchical structure of the tree, it is necessary to provide a nested array of JavaScript objects.

var tree = [
  {
    text: "Node 1",
    icon: "fa fa-folder",
    expanded: true,
    nodes: [
      {
        text: "Sub Node 1",
        icon: "fa fa-folder",
        nodes: [
          {
            id:    "sub-node-1",
            text:  "Sub Child Node 1",
            icon:  "fa fa-folder",
            class: "nav-level-3",
            href:  "https://google.com"
          },
          {
            text: "Sub Child Node 2",
            icon: "fa fa-folder"
          }
        ]
      },
      {
        text: "Sub Node 2",
         icon: "fa fa-folder"
      }
    ]
  },
  {
    text: "Node 2",
    icon: "fa fa-folder"
  },
  {
    text: "Node 3",
    icon: "fa fa-folder"
  },
  {
    text: "Node 4",
    icon: "fa fa-folder"
  },
  {
    text: "Node 5",
    icon: "fa fa-folder"
  }
];

5. This property text is required to display the contract.

{
  text: "Node 1"
}

Must Read: 

Vuetify Drag And Drop Draggable Tree View Component | v-treeview
jQuery Dynamic Hierarchy Treeview Plugin | jsTree

Official Website(nhmvienna): Click Here

This superior jQuery/javascript plugin is developed by nhmvienna. For extra advanced usage, please go to the official website.