javascript - how to get complete parent node name in js tree while selecting the child node -

i getting child tree name want complete hierarchy of parent node names.

below code shows how child node , print value in particular div element:

$(document).ready(function () {     $('#bdeviewnew').on('changed.jstree', function (e, data) {         var i, j, r = [];          (i = 0, j = data.selected.length; < j; i++) {             r.push(data.instance.get_node(data.selected[i]).text.trim());             $('#treebreadcrumbs').html(r.join(', '));         }     }); }); 

now prints value of child node, e.g. child a. want follows, if tree structure shown below:

parent   child 1     child     child b   child 2     child c     child d 

so if click on child a want div content updated

parent > child 1 > child 

as of getting child a only. please let me know how can correct output.

i tried shown below path of parent node:

$(document).ready(function() { $('#bdeviewnew').on('changed.jstree', function(e, data) { var ids = data.inst.get_path('#bdeviewnew' + data.rslt.obj.attr('id'),true); var names = data.inst.get_path('#bdeviewnew' + data.rslt.obj.attr('id'),false); alert("path [id or name] root node selected node = id's = "+ids+" :: name's = "+names);  });  }); 

but still no result get_path. need use different js or plugin? , meaning of attr('id') should pass id of li or else did'nt understand syntax properly.

adding jstree:

 <div id="bdeviewnew">     <ul>           <li id="bde" data-jstree='{"opened":true,"icon":"./images/tree.png"}'">             parent 1              <ul>                  <li id="aaa" data-jstree='{"opened":true,"icon":"./images/tree.png"}'>                     child 1 <c:foreach items="${empinfo.emplist}"                         var="empvalue">                         <ul>                             <li id="bbb" data-jstree='{"icon":"./images/tree.png"}' >${empvalue.empname}</li>                         </ul>                     </c:foreach>                 </li>             </ul>             <ul>                 <li id="ccc" data-jstree='{"icon":"./images/tree.png"}'>child 2                     <c:foreach items="${imginfo.imglist}"                         var="imgvalue">                         <ul>                             <li id="ddd" data-jstree='{"icon":"./images/tree.png"}'>${imgvalue.imgname}</li>                         </ul>                     </c:foreach>                 </li>             </ul>         </li>     </ul> </div> 

this work fine... full parents...

    $('#bdeviewnew').on('select_node.jstree', function (e, data) {         var lomainselected = data;         uigetparents(lomainselected);     });      function uigetparents(loselectednode) {         try {             var lnlevel = loselectednode.node.parents.length;             var lsselectedid = loselectednode.node.id;             var loparent = $("#" + lsselectedid);             var lsparents =  loselectednode.node.text + ' >';             (var ln = 0; ln <= lnlevel -1 ; ln++) {                 var loparent = loparent.parent().parent();                 if (loparent.children()[1] != undefined) {                     lsparents += loparent.children()[1].text + " > ";                 }             }             if (lsparents.length > 0) {                 lsparents = lsparents.substring(0, lsparents.length - 1);             }             alert(lsparents);         }         catch (err) {             alert('error in uigetparents');         }     }