JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://static.jstree.com/3.2.1/assets/dist/themes/default/style.min.css">
<script src="https://code.jquery.com/jquery-1.12.0.min.js"></script>
<script src="https://static.jstree.com/3.2.1/assets/dist/jstree.min.js"></script>
<div id='cat_tree'>
  <ul>
    <li id="1">First
        <ul>
        
          <li id="2">First</li>
          <li id="3">First</li>
        </ul>
    </li>
    
    <li id="4">First</li>
    
    
    <li id="5">First</li>
    
    
    <li id="6">First</li>
  </ul>
</div>


<button id="click">
  Click
</button>

JavaScript

$(function () { 
    		$('#cat_tree').jstree({"core": {
		        "themes":{
		            "icons":false
		        }
		    }}); 
        
        
      
      var data = [
       { "id" : "7", "parent" : "#4", "text" : "second" },
       { "id" : "8", "parent" : "#4", "text" : "second" },
    ];
    
$('#click').click(function() {
$('#cat_tree').jstree().create_node($('#4'), data, 'last', function(){
    alert("done");
}, true);

      });
      
      
    	});