JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://code.angularjs.org/1.1.0/angular.min.js"></script>
<div ng-app="alert" ng-controller="homeCtrl">
    <input type="search" ng-model="name" ng-change="filter()" placeholder="filter..." />

    <ul id="list">
       <li><a href="#xuemin">Xuemin #</a>
         <ul>
             <li><a href="#bob">Bob 1</a></li>
             <li><a href="#lisa">Lisa 1</a></li>
             <li><a href="#lewis">Lewis 1</a></li>
             <li><a href="#xuemin">Xuemin 1</a></li>
             <li><a href="#tom">Tom 1</a></li>
             <li><a href="#cassidy">Cassidy 1</a></li>
          </ul>
       </li>
       <li><a href="#xuemin">Xuemin #</a>
         <ul>
             <li><a href="#bob">Bob 1</a></li>
             <li><a href="#lisa">Lisa 1</a></li>
             <li><a href="#lewis">Lewis 1</a></li>
             <li><a href="#xuemin">Xuemin 1</a></li>
             <li><a href="#tom">Tom 1</a></li>
             <li><a href="#cassidy">Cassidy 1</a></li>
          </ul>
       </li>
       <li><a href="#xuemin">Xuemin #</a>
         <ul>
             <li><a href="#bob">Bob 1</a></li>
             <li><a href="#lisa">Lisa 1</a></li>
             <li><a href="#lewis">Lewis 1</a></li>
             <li><a href="#xuemin">Xuemin 1</a></li>
             <li><a href="#tom">Tom 1</a></li>
             <li><a href="#cassidy">Cassidy zz1</a></li>
          </ul>
       </li>
       <li><a href="#xuemin">Xuemin #</a>
         <ul>
             <li><a href="#bob">Bob 1</a></li>
             <li><a href="#lisa">Lisa 1</a></li>
             <li><a href="#lewis">Lewis 1</a></li>
             <li><a href="#xuemin">Xuemin 1</a></li>
             <li><a href="#tom">Tom 1</a></li>
             <li><a href="#cassidy">Cassidy 1</a></li>
          </ul>
       </li>
       <li><a href="#xuemin">Xuemin #</a>
         <ul>
             <li><a href="#bob">Bob 1</a></li>
             <li><a href="#lisa">Lisa 1</a></li>
             <li><a href="#lewis">Lewis 1</a></li>
            ...

CSS

li > ul > li{
  
  margin-left: 20px;
  
}

JavaScript

var app = angular.module('alert', []);

app.controller('homeCtrl', function ($scope) {
    
    $scope.filter = function() {
        var blocks = document.getElementById('list').children;
        for (var i = 0; i < blocks.length; ++i) {
            var block = blocks[i],
            		lis = block.querySelectorAll('li'),
                cnt = lis.length;
                
            for(var m = 0; m < lis.length; ++m){
              var li = lis[m],
              	name = li.children[0].innerHTML.toLowerCase();
            	if (name.indexOf($scope.name.toLowerCase()) != -1 || $scope.name == "") {
                  li.style.display = "block";                  
            	} else {
                li.style.display = "none";
                --cnt;
            	}   
            }
            
            console.log('cnt', block)
            if(cnt < 1){
            	block.style.display = "none";
            }
            else{            
            	block.style.display = "block";
            }

        }
    }
});