$(document).ready(function() { 
  var reportingData = { 
    'name': '1', 
    'title': 'general manager', 
    'children': [{ 
        'name': '2A', 
        'title': 'department manager' 
      }, 
      { 
        'name': '2B', 
        'title': 'department manager', 
        'children': [{ 
            'name': '3A', 
            'title': 'senior engineer' 
          },{ 
            'name': '3C', 
            'title': 'senior engineer' 
          }, 
          { 
            'name': '3B', 
            'title': 'senior engineer', 
            'children': [{ 
                'name': '4A', 
                'title': 'engineer' 
              }, 
              { 
                'name': '4B', 
                'title': 'UE engineer', 
                'children': [{ 
                    'name': '5A', 
                    'title': 'engineer' 
                  }, 
                  { 
                    'name': '5B', 
                    'title': 'UE engineer' 
                  } 
                ] 
              } 
            ] 
          } 
        ] 
      }, 
      { 
        'name': '2C', 
        'title': 'department manager' 
      }, 
      { 
        'name': '2D', 
        'title': 'department manager' 
      }, 
      { 
        'name': '2E', 
        'title': 'department manager', 
        'children': [{ 
            'name': '3A', 
            'title': 'senior engineer' 
          }, 
          { 
            'name': '3B', 
            'title': 'senior engineer', 
            'children': [{ 
                'name': '4A', 
                'title': 'engineer' 
              }, 
              { 
                'name': '4B', 
                'title': 'UE engineer' 
              } 
            ] 
          } 
        ] 
      }, 
      { 
        'name': '2F', 
        'title': 'department manager' 
      }, 
      { 
        'name': '2G', 
        'title': 'department manager' 
      }, 
      { 
        'name': '2H', 
        'title': 'department manager' 
      } 
    ] 
  }; 
 
  var $rsContainer = $('#reportingStructure'); 
 
  var reportingConfig = $('#reportingStructure').orgchart({ 
    'data': reportingData, 
    'nodeId': 'id', 
    'nodeContent': 'title', 
    'nodeTemplate': nodeTemplate, 
    'direction': 'l2r', 
    'visibleLevel': 1 
  }); 
 
  var nodeTemplate = function(data) { 
    return `<div> 
                    <div class="title">${data.name}</div> 
                    <div class="content">${data.title}</div> 
                </div>`; 
  }; 
 
  $rsContainer.on('click', '.node', function() { 
    var $this = $(this); 
    $('#selected-node').val($this.find('.title').text()).data('node', $this); 
    var $node = $('#selected-node').data('node'); 
    var childNodeStatus = reportingConfig.getNodeState($node, 'children') 
    var siblingNodesStatus = reportingConfig.getNodeState($node, 'siblings') 
    //console.log(childNodeStatus); 
    //console.log(siblingNodesStatus); 
    //debugger; 
 
    if (childNodeStatus.exist && !childNodeStatus.visible && !siblingNodesStatus.exist && !siblingNodesStatus.visible) { 
      showChildren($node); 
    } else if (childNodeStatus.exist && childNodeStatus.visible && !siblingNodesStatus.exist && !siblingNodesStatus.visible) { 
      reportingConfig.hideChildren($node) 
    } else if (childNodeStatus.exist && !childNodeStatus.visible && siblingNodesStatus.exist && siblingNodesStatus.visible) { 
      showChildren($node); 
      reportingConfig.hideSiblings($node) 
    } else if (childNodeStatus.exist && childNodeStatus.visible && siblingNodesStatus.exist && !siblingNodesStatus.visible) { 
      reportingConfig.hideChildren($node) 
      reportingConfig.showSiblings($node) 
    } else if (childNodeStatus.exist && !childNodeStatus.visible && siblingNodesStatus.exist && !siblingNodesStatus.visible) { 
      showChildren($node); 
      reportingConfig.hideSiblings($node) 
    } 
 
  }); 
 
  function showChildren($node) { 
	reportingConfig.showChildren($node); 
	var children = reportingConfig.getRelatedNodes($node, 'children'); 
	for (var i = 0; i < children.length; i++) { 
	  reportingConfig.showSiblings($(children[i])); 
	} 
  } 
})

.orgchart .edge { 
  display: none; 
}

<link href="https://cdnjs.cloudflare.com/ajax/libs/orgchart/2.1.1/css/jquery.orgchart.min.css" rel="stylesheet" /> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/orgchart/2.1.1/js/jquery.orgchart.js"></script> 
<input type="text" id="selected-node" /> 
<div id="reportingStructure"></div>