jstree click button for each item

by bonjour0099

HTML

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
<link rel="stylesheet" href="http://www.sldesign.url.tw/style.css">
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
<script src="http://www.sldesign.url.tw/jstree.js"></script>

<div id="data" class="demo"></div>

	<!-- Modal -->
	<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"
		aria-hidden="true">
		<div class="modal-dialog" role="document">
			<div class="modal-content">
				<div class="modal-header">
					<h5 class="modal-title" id="exampleModalLabel">Modal title</h5>
					<button type="button" class="close" data-dismiss="modal" aria-label="Close">
						<span aria-hidden="true">&times;</span>
					</button>
				</div>
				<div class="modal-body">
					...
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
					<button type="button" class="btn btn-primary">Save changes</button>
				</div>
			</div>
		</div>
	</div>

CSS

html {
  margin: 0;
  padding: 0;
  font-size: 62.5%;
}

body {
  max-width: 800px;
  min-width: 300px;
  margin: 0 auto;
  padding: 20px 10px;
  font-size: 14px;
  font-size: 1.4em;
}

h1 {
  font-size: 1.8em;
}

.demo {
  overflow: auto;
  border: 1px solid silver;
}

.edit-member {
  position: absolute;
  right: 0;
  z-index: 999;
}

JavaScript

$(function () {
			// Init
			$('#data').jstree({
				'core': {
					'multiple': false,

					//"animation" : 0,
					"check_callback": true,
					//'force_text' : true,

					'data': TestData
				},
				"plugins": ["contextmenu", "dnd", "state", "types", "wholerow"]
			});
		});
		//Data
		var TestData = [{
				"text": "Level 1A",
				"state": {
					"opened": true
				},
				"children": [{
						"text": "Level 2A",
						"state": {
							"opened": true
						}
					},
					{
						"text": "Level 2B",
						"state": {
							"opened": true
						}
					}
				]
			},
			{
				"text": "Level 1B",
				"state": {
					"opened": true
				}
			}
		];