duda menu bootstrap

saludos estoy intentando crear un menu con bootstrap he probado tanto con dropdown como con treeview , si conseguir la jerarquia que consigo con tree javascript......

alguien puede decirme si se puede conseguir esta jaraquia con bootstrap.... y si se puede decirme como.......
Código:
<ul>
        <li><span><i class="fa fa-bars fa-2x"></i></span> <a href=""><!--Padre--></a>
            <ul>
                <li><span><i class="fa fa-angle-left pull-right inicio"></i>Inicio</span> <a href=""></a>
                	<ul>
                        <li><span><i class="icon-leaf"></i> Submenu 1</span> <a href=""></a>
                        </li><!--Nieto-->
                    </ul>
                </li><!--Hijo-->
                <li><span><i class="fa fa-angle-left pull-right moda"></i> Colecciones Moda</span> <a href=""><!--Hijo--></a>
                    <ul>
                        <li><span><i class="fa fa-angle-left pull-right nacido"></i> Recien Nacido</span> <a href=""></a>
                            <ul>
		                        <li><span><i class="icon-leaf"></i> Submenu 1</span> <a href=""></a>
		                        </li><!--BisNieto-->
		                        <li><span><i class="icon-leaf"></i> Submenu 2</span> <a href=""></a>
		                        </li><!--BisNieto-->
		                    </ul>
                        </li><!--Nieto-->
                        <li><span><i class="fa fa-angle-left pull-right colect"></i> Colecciones</span> <a href=""></a>
                            <ul>
		                        <li><span><i class="icon-leaf"></i> Submenu 1</span> <a href=""></a>
		                        </li><!--BisNieto-->
		                        <li><span><i class="icon-leaf"></i> Submenu 2</span> <a href=""></a>
		                        </li><!--BisNieto-->
		                    </ul>
                        </li><!--Nieto-->
                        <li><span><i class="fa fa-angle-left pull-right sin_nombre"></i> Sin nombre</span> <a href=""></a>
                            <ul>
		                        <li><span><i class="icon-leaf"></i> Submenu 1</span> <a href=""></a>
		                        </li><!--BisNieto-->
		                        <li><span><i class="icon-leaf"></i> Submenu 2</span> <a href=""></a>
		                        </li><!--BisNieto-->
		                    </ul>
                        </li><!--Nieto-->
                        <li><span><i class="fa fa-angle-left pull-right patuc"></i> Patucos</span> <a href=""></a>
                            <ul>
                                <li><span><i class="fa fa-angle-left pull-right bebe"></i> Beb&eacute; Ni&ntilde;a 3-24 Meses</span> <a href=""></a>
		                            <ul>
		                                <li><span><i class="icon-leaf"></i> Submenu 1</span> <a href=""></a>
		                                </li><!--Tataranieto-->
		                                <li><span><i class="icon-leaf"></i> Submenu 2</span> <a href=""></a>
		                                </li><!--Tataranieto-->
		                            </ul>
                                </li><!--BisNieto-->
                                <li><span><i class="fa fa-angle-left pull-right bebe"></i> Beb&eacute; Ni&ntilde;o 3-24 Meses</span> <a href=""></a>
                                    <ul>
		                                <li><span><i class="icon-leaf"></i> Submenu 1</span> <a href=""></a>
		                                </li><!--Tataranieto-->
		                                <li><span><i class="icon-leaf"></i> Submenu 2</span> <a href=""></a>
		                                </li><!--Tataranieto-->
		                            </ul>
                                </li><!--Bisnieto-->
                                <li><span><i class="fa fa-angle-left pull-right nene"></i> Ni&ntilde;as 2-10 a&ntilde;as</span> <a href=""></a>
                                    <ul>
		                                <li><span><i class="icon-leaf"></i> Submenu 1</span> <a href=""></a>
		                                </li><!--Tataranieto-->
		                                <li><span><i class="icon-leaf"></i> Submenu 2</span> <a href=""></a>
		                                </li><!--Tataranieto-->
		                            </ul>
                                </li><!--BisNieto-->
                                <li><span><i class="fa fa-angle-left pull-right nene"></i> Ni&ntilde;as 2-10 a&ntilde;os</span> <a href=""></a>
                                    <ul>
		                               	<li><span><i class="icon-leaf"></i> Submenu 1</span> <a href=""></a>
		                                </li><!--Tataranieto-->
		                                <li><span><i class="icon-leaf"></i> Submenu 2</span> <a href=""></a>
		                                </li><!--Tataranieto-->
		                            </ul>
                                </li><!--BisNieto-->
                            </ul>
                        </li><!--Nieto-->
            	</ul><!-- fin lista nietos-->
        	</li>
    	</ul><!-- fin lista padre-->
	</div>