JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

<div id='myMenu' class="dropdown">

</div>

CSS

.dropdown-submenu {
  position: relative;
}

.dropdown-submenu .dropdown-menu {
  top: 0;
  left: 100%;
  margin-top: -1px;
}

JavaScript

var categories = [{
  text: "engine",
  children: [1, 2, 3, {
    text: "piston",
    children: [4, 5, 6]
  }]
}, {
  text: "tire",
  children: [7, 8, 9]
}];

function menuToElement(menu) {
  const ul = document.createElement("ul");
  ul.className = 'dropdown-menu';
  for (const item of menu) {
    const li = document.createElement("li");
      if (Object(item) === item) {
        li.textContent = item.text;
        li.appendChild(menuToElement(item.children));
        li.className = "dropdown-submenu";
      } else {
        li.textContent = item;
      }
      ul.className = 'dropdown-menu';
      ul.appendChild(li);
    }
    return ul;
}
 
  $(document).ready(function() {
  
  var menu = menuToElement(categories);
  document.getElementById('myMenu').innerHTML = "<button class='btn btn-default dropdown-toggle' type='button' data-toggle='dropdown'>Categories<span class='caret'></span></button>";
  document.getElementById('myMenu').appendChild(menu);
   
  liList = document.getElementsByTagName('li');
  for (var i = 0; i < liList.length; i++) {
    items = liList[i].childNodes;
    if (items.length > 1)
    {
   			liList[i].innerHTML = "<a class='test' tabindex='-1' href='#'>" + items[0].textContent+ "<span class='caret'></span></a>" + "<ul class='dropdown-menu'>" + items[1].innerHTML + "</ul>";
    }
    else if (items.length == 1){
		  	liList[i].innerHTML = "<a class='test' tabindex='-1' href='#'>" + items[0].textContent + "</a>"; 	
		}
  }
  
    $('#myMenu a').on("click", function(e) {
      $(this).next('ul').toggle();
      e.stopPropagation();
      e.preventDefault();
    });
  });