Как mtree.js использовать вместе с Bootstrap?

Здравия. Использую библиотеку mtree.js, но не получается добавить к ней элементы из бутстрапа. Имею следующий код:

<ul class="mtree">
  <li><a href='#'>01.ДСП --891</a>
    <ul>
      <li><a href='#'>1.1 ДСП Ивацевичи (Белоруссия)</a>
        <ul>
          <li><a href='#'>1.1.1 ДСП 2750*1830*10мм Белорусь</a></li>
          <li><a href='#'>1.1.2 ДСП 2750*1830*16мм Белорусь</a></li>
          <li><a href='#'>1.1.3 ДСП 2750*1830*18мм Белорусь</a></li>
          <li><a href='#'>1.1.4 ДСП 2800*2070*16мм Белорусь</a></li>
        </ul>
      </li>
      <li><a href='#'>1.2 ДСП LAMARTY</a>
        <ul>
          <li><a href='#'>1.2.1 ДСП LAMARTY 10мм</a></li>
          <li><a href='#'>1.2.2 ДСП LAMARTY 16мм</a></li>
        </ul>
      </li>
      <li><a href='#'>1.3 ДСП РУССКИЙ ЛАМИНАТ </a></li>
      <li><a href='#'>1.4 ДСП WBM РАСПРОДАЖА </a>
        <ul>
          <li><a href='#'>1.4.1 ДСП 2750*1830*10мм </a></li>
          <li><a href='#'>1.4.2 ДСП 2750*1830*18мм </a></li>
          <li><a href='#'>1.4.3 ДСП 2750*1830*16мм </a></li>
        </ul>
      </li>
      <li><a href='#'>1.5 ДСП КРОНОСПАН РАСПРОДАЖА </a>
        <ul>
          <li><a href='#'>1.5.1 ДСП 2750*1830*10мм Кроноспан </a></li>
          <li><a href='#'>1.5.2 ДСП 2750*1830*16мм Кроноспан </a></li>
        </ul>
      </li>
      <li><a href='#'>1.6 ДСП КРОНОУКРАИНА,КРОНОСТАР </a></li>
      <li><a href='#'>1.7 ДСП EGGER </a></li>
      <li><a href='#'>1.8 ДСП CLEAF </a></li>
      <li><a href='#'>УЦЕНКА </a></li>
    </ul>
  </li>
  <li><a href='#'>02 ДВП,МДФ,ФАНЕРА --941</a>
    <ul>
      <li><a href='#'>2.1 ДВП </a></li>
      <li><a href='#'>2.2 ФАНЕРА </a></li>
      <li><a href='#'>2.3 МДФ </a></li>
    </ul>
  </li>
  <li><a href='#'>03 ПАНЕЛИ,РАТАНГ,СОФТЫ --959</a>
    <ul>
      <li><a href='#'>3.1 ПАНЕЛИ НЕВСКИЙ ЛАМИНАТ</a></li>
      <li><a href='#'>3.2 ПАНЕЛИ АЛЬБИКО </a></li>
      <li><a href='#'>3.3 ПАНЕЛИ HiGloss </a></li>
      <li><a href='#'>3.4 ПАНЕЛИ МДФ AKROPA </a></li>
      <li><a href='#'>3.5 РАТАНГ, БАМБУК </a></li>
      <li><a href='#'>3.6 СОФТЫ </a></li>
    </ul>
  </li>
  <li><a href='#'>04 СТОЛЕШНИЦЫ --946</a>
    <ul>
      <li><a href='#'>4.1 СТОЛЕШНИЦЫ СКИФ </a>
        <ul>
          <li><a href='#'>4.1.01 СТОЛЕШНИЦЫ СКИФ 26мм МАТОВЫЕ </a></li>
          <li><a href='#'>4.1.02 СТОЛЕШНИЦЫ СКИФ 26мм ГЛЯНЕЦ </a></li>
          <li><a href='#'>4.1.03 СТОЛЕШНИЦЫ СКИФ 38мм МАТОВАЯ </a></li>
          <li><a href='#'>4.1.04 СТОЛЕШНИЦЫ СКИФ 38мм ГЛЯНЕЦ </a></li>
          <li><a href='#'>4.1.05 СТОЛЕШНИЦЫ 1200*3000*26мм </a></li>
          <li><a href='#'>4.1.06 СТОЛЕШНИЦЫ 1200*3000*38мм </a></li>
          <li><a href='#'>4.1.07 Мебельный ЩИТ СКИФ МАТОВЫЙ </a></li>
          <li><a href='#'>4.1.08 Мебельный ЩИТ СКИФ ГЛЯНЕЦ </a></li>
          <li><a href='#'>4.1.09 ПОСТФОРМИНГ 600 мм СКИФ </a></li>
          <li><a href='#'>4.1.10 ПОСТФОРМИНГ 800 мм СКИФ </a></li>
          <li><a href='#'>4.1.11 ПОСТФОРМИНГ 1200 мм СКИФ </a></li>
          <li><a href='#'>4.1.12 УГЛОВОЙ СЕГМЕНТ СКИФ </a></li>
          <li><a href='#'>4.1.13 Планки дстолешниц, плинтус СКИФ </a></li>
          <li><a href='#'>4.1.14 КРОМКА СКИФ </a></li>
          <li><a href='#'>4.1.15 СТОЛЕШНИЦЫ СКИФ 60мм МАТОВАЯ </a></li>
        </ul>
      </li>
      <li><a href='#'>4.2 СТОЛЕШНИЦЫ WILSONART </a></li>
      <li><a href='#'>4.3 СТОЛЕШНИЦЫ ТРОЯ </a>
        <ul>
          <li><a href='#'>4.3.1 СТОЛЕШНИЦЫ ТРОЯ 26мм </a></li>
          <li><a href='#'>4.3.2 СТОЛЕШНИЦЫ ТРОЯ 38мм </a></li>
          <li><a href='#'>4.3.3 ПАНЕЛЬ ТРОЯ 6мм </a></li>
          <li><a href='#'>4.3.4 УГЛОВОЙ СЕГМЕНТ ТРОЯ </a></li>
          <li><a href='#'>4.3.5 КРОМКА ТРОЯ </a></li>
        </ul>
      </li>
      <li><a href='#'>4.4 СТОЛЕШНИЦЫ СЛОПЛАСТ, FORMICA </a></li>
      <li><a href='#'>4.5 СТОЛЕШНИЦЫ ARPA </a>
        <ul>
          <li><a href='#'>4.5.1 Столешницы,кромка АРПА СКЛАД </a></li>
          <li><a href='#'>4.5.2 Столешницы,кромка АРПА ЗАКАЗ </a></li>
        </ul>
      </li>
      <li><a href='#'>4.6 СТОЛЕШНИЦЫ СЛОТЕКС </a></li>
      <li><a href='#'>4.7 СТОЛЕШНИЦЫ НЕСТАНДАРТ </a></li>
      <li><a href='#'>4.8 СТОЛЕШНИЦЫ РАСПРОДАЖА </a></li>
    </ul>
  </li>
</ul>

очень хочется сделать, чтобы при нажатии на элемент последнего уровня, например на:

<li>
  <a href='#'>1.1.4 ДСП 2800*2070*16мм Белорусь </a>
</li>

открывался скрытый блок div (style="dispaly:none"). Пробовал вешать скрипт на onclick, который меняет это свойство у дива, но не выходит. Может кто-нибудь подскажет? Если нужна оплата, скажите. Заранее спасибо.

<script type="text/javascript">
            
            function showHide(element_id) {
                if (document.getElementById(element_id)) { 
                    var obj = document.getElementById(element_id); 
                    if (obj.style.display != "block") { 
                        obj.style.display = "block"; //Показываем элемент
                    }
                    else obj.style.display = "none"; //Скрываем элемент
                }
            }   
        </script>

<a onclick="showHide('10635')" href="javascript:void(0)">Угол 135 хром </a>
<div id="10635" class="alert alert-danger" style="display: none;">
<a onclick="showHide('10635')" href="javascript:void(0)">Закрыть</a>
</div>

ul.mtree {
  font-size: 16px;
}
ul.mtree ul,li {
  margin: 0px;
  padding: 0px;
}
ul.mtree a:focus, a:hover {
  text-decoration: none;
}

<!-- Некоторый блок -->
<div id="myID" class="alert alert-danger" style="display:none">...</div>
...
<script>
jQuery( "ul.mtree li:last-of-type" ).filter("li :not(ul)").find('a').click(function() {
  jQuery('#myID').show();
});
</script>