JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://testbox.drkameleon.com/peppermint/css/bootstrap.min.css">
<link rel="stylesheet" href="http://testbox.drkameleon.com/peppermint/css/jquery.jqtree.css">
<script src="http://testbox.drkameleon.com/peppermint/js/jquery.jqtree.min.js"></script>
<div id="filetree"></div>

CSS

#filetree {
    .jqtree-toggler {
        font-family:'Glyphicons Halflings';
        font-size:12px;
        margin-right:10px;
        //padding:10px;
    }
    .jqtree-element {
        height: 24px;
        text-shadow: 0 0 0.1em #FFF, 0 0 0.1em #FFF;
        padding-left:5px;
    }
    ul.jqtree-tree ul.jqtree_common .jqtree-element {
        //margin-left: 12px;
    }
    li.jqtree-selected > .jqtree-element, li.jqtree-selected > .jqtree-element:hover {
        background: -webkit-gradient(linear, left top, left bottom, from(#65B1E0), to(#3188CD));
        background: -moz-linear-gradient(top, #65B1E0, #3188CD);
        background: -ms-linear-gradient(top, #65B1E0, #3188CD);
        background: -o-linear-gradient(top, #65B1E0, #3188CD);
        text-shadow: 0 0 0.1em #000, 0 0 0.1em #000;
        border-top: 1px solid #58A5DA;
        border-bottom: 1px solid #2E7BBD;
        span {
            color: white;
            font-family: Helvetica;
        }
        .jqtree-toggler {
            color: white;
        }
    }
}

.jqtree-selected> .jqtree-element::before {
    content:"";
    display:block;
    width:100%;
    position:absolute;
    top:0px;
    left:-100%;
    height:21px;
    background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(190, 224, 245)), to(rgb(137, 175, 202)));
}

JavaScript

// Tree data

var filesTree = [{
    id: 1,
    label: 'node1',
    children: [{
        id: 2,
        label: 'child1',
        children: [{
            id: 6,
            label: 'child1.1',
            children: [{
                id: 8,
                label: 'child1.1.1'
            }]
        }, {
            id: 7,
            label: 'child1.2'
        }]
    }, {
        id: 3,
        label: 'child2'
    }]
}, {
    id: 4,
    label: 'node2',
    children: [{
        id: 5,
        label: 'child3'
    }]
}];

// Tree initialisation

$('#filetree').tree({
    data: filesTree,
    dragAndDrop: true,
    autoOpen: 0,
    saveState: true,
    useContextMenu: false,
});