JsTree stopPropagation

by CloughyLow

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/jstree/3.0.8/jstree.min.js"></script>
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css">
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/jstree/3.0.8/themes/default/style.min.css">
<div id="myTreeview">
    <ul>
        <li class="jstree-open" data-jstree='{"icon":"fa fa-folder"}'>
            title <span class="nodeInfo">?</span>
            <ul>
                <li data-jstree='{"icon":"fa fa-file-pdf-o"}'><a href="#">My file</a></li>
                <li data-jstree='{"icon":"fa fa-file-pdf-o"}'><a href="#">My file</a></li>
                <li data-jstree='{"icon":"fa fa-file-pdf-o"}'><a href="#">My file</a></li>
            </ul>
        </li>
        <li class="jstree-open" data-jstree='{"icon":"fa fa-folder"}'>
            title <span class="nodeInfo">?</span>
            <ul>
                <li data-jstree='{"icon":"fa fa-file-pdf-o"}'><a href="#">My file</a></li>
                <li data-jstree='{"icon":"fa fa-file-pdf-o"}'><a href="#">My file</a></li>
                <li data-jstree='{"icon":"fa fa-file-pdf-o"}'><a href="#">My file</a></li>
            </ul>
        </li>
    </ul>
</div>

CSS

.nodeInfo {
        background-color: #de1c09;
        color: #fff;
        font-weight: bold;
        display: inline-block;
        padding: 0 7px;
        font-size: 10px;
        line-height: 16px;
        text-decoration: none;
        border-radius: 3px;
        margin: 0 0 0 3px;
        cursor: pointer;
        
        &:hover {
            background-color: #000;
        }
    }

JavaScript

$('#myTreeview').jstree({});

$('#myTreeview').on('select_node.jstree', function (e, data) {
        // avoid selection
        $('#myTreeview').jstree(true).deselect_node(data.node);
        // trigger open close
        if (data.node.children.length > 0) {
            $('#myTreeview').jstree(true).toggle_node(data.node);
        } 
        //restore links
        else {
            var href = data.node.a_attr.href;
            window.open( href,'_blank' );
        }
    });
// ------------------DOESNT SEEM TO WORK ---------------------
//stop propagation for nodeInfo DOESNT SEEM TO WORK
$('body').on('click','.nodeInfo', function(event){
    event.stopPropagation();
    alert('test');
});