JqTree

HTML

<script src="http://mbraak.github.io/jqTree/tree.jquery.js"></script>
<link rel="stylesheet" href="http://mbraak.github.io/jqTree/jqtree.css">
<button type="button" name="psychTree-selected">Show Selected</button>
<br />
<input type="text" name="psychTree-filter" style="width:50%" placeholder="search"/>

<div id="psychTree"></div>

JavaScript

// tree data
var psychData = [
      {
        name: 'Neurodevelopmental Disorders', id: 1,
        children:[
          { name: 'Intellectual Disability', id: 2, parent2: 'Neurodevelopment Disorders' },
          { name: 'Speech Sound Disorder', id: 3 },
          { name: 'Childhood Onset Fluency Disorder (Stuttering)', id: 4 },
          { name: 'Autism Spectrum Disorder', id: 5 },
          { name: 'Attention-Deficit/Hyperactivity Disorder', id: 6 },
          { name: 'Tourettes Disorder', id: 7 }
        ]
      },
      {
        name: 'Schizophrenia Spectrum and Psychotic Disorders', id: 8,
        children:[
          { name: 'Schizotypal Personality Disorder', id: 9 },
          { name: 'Delusional Disorder', id: 10 },
          { name: 'Brief Psychotic Disorder', id: 11 },
          { name: 'Schizophreniform Disorder', id: 12 },
          { name: 'Schizophrenia', id: 13 },
          { name: 'Psychotic Disorder Due to Medical Condition', id: 14 },
          { name: 'Catatonia', id: 15 }
        ]
      }
			];

var filter = $('input[name="psychTree-filter"]');
var _filtering = false;
var thread = null;
$('#psychTree').tree({
      data       : psychData,
      selectable : true,
      dragAndDrop: false,
      useContextMenu: false,
      // closedIcon: $('<i class="fa fa-folder"></i>'),
      // openedIcon: $('<i class="fa fa-folder-open"></i>'),
      onCreateLi: function(node, $li) {
        var title = $li.find('.jqtree-title');
        var search = filter.val().toLowerCase();
        var value = title.text().toLowerCase();
        if (search !== '') {
              var _parent = node.parent;
              var _parentValue = (typeof _parent.name === 'string') ? _parent.name.toLowerCase() : "";
              $li.hide();
          while (typeof (_parent.element) !== 'undefined') {
            if (value.indexOf(search) > -1 || _parentValue.indexOf(search) > -1) {
                  $li.show();
                 ...