JavaScript Живой поиск по элементам

Пытаюсь реализовать живой поиск. При вводе букв в input необходимо отобразить блок div, исходя из набранного текста. Проблема в том, что, вместо отображения целого блока, скрипт режет его кусками.

    <input type=search data-search id="search" autocomplete="off">
    <div class="item angled-bg" id="charItem" data-searchable>
     <!-- <div> остальные элементы</div>  -->
    </div>
<script type="text/javascript">
        document.querySelector('[data-search]').addEventListener('keyup',filter)
        function filter(){
          var term = document.querySelector('[data-search]').value
          var tag = document.querySelectorAll('[data-searchable] div')
          for (i=0;i<tag.length;i++){
            if (tag[i].innerHTML.indexOf(term) !== -1){
              tag[i].style.display = 'block'
            } else {
              tag[i].style.display = 'none'
            }
          }
        }
</script>

Подскажите, пожалуйста, как это решить?