Greetings
I am trying to us Bootstrap with our CMS. Are there any techniques in Bootstrap that allows me to style a dynamically generate menu so that it behaves like one that has been hand coded.
I have tried using jQuery to add and remove classes with limited success.
Thanks
Here is some partial code on the menu structure and classes generated by our CMS:
<ul id="sectionMenuElementID_1" class="ipf-sectionmenu">
<li id="pageid4949" data-pageid="4949" data-level="1">
<div><a href="Item 1">Item 1</a></div>
</li>
<li id="pageid151" data-pageid="151" class="ipf-parent" data-level="1">
<div><a href="Item 1">Item 1</a></div>
<ul>
<li id="pageid152" data-pageid="152" data-level="2"><a href="Item 1">Item 1</a></li>
<li id="pageid4869" data-pageid="4869" data-level="2"><a href="Item 1">Item 1</a></li>
</ul>
</li>
<li id="pageid104" data-pageid="104" class="ipf-parent" data-level="1">
<div><a href="Item 1">Item 1</a></div>
<ul>
<li id="pageid105" data-pageid="105" data-level="2"><a href="Item 1">Item 1</a></li>
<li id="pageid106" data-pageid="106" data-level="2"><a href="Item 1">Item 1</a></li>
<li id="pageid107" data-pageid="107" data-level="2"><a href="Item 1">Item 1</a></li>
<li id="pageid4965" data-pageid="4965" data-level="2"><a href="Item 1">Item 1</a></li>
<li id="pageid5126" data-pageid="5126" data-level="2"><a href="Item 1">Item 1</a></li>
<li id="pageid11991" data-pageid="11991" data-level="2"><a href="Item 1">Item 1</a></li>
</ul>
</li>
<li id="pageid145" data-pageid="145" class="ipf-parent" data-level="1">
<div><a href="Item 1">Item 1</a></div>
<ul>
<li id="pageid2474" data-pageid="2474" data-level="2"><a href="Item 1">Item 1</a></li>
<li id="pageid148" data-pageid="148" data-level="2"><a href="Item 1">Item 1</a></li>
<li id="pageid149" data-pageid="149" data-level="2"><a href="Item 1">Item 1</a></li>
<li id="pageid1838" data-pageid="1838" data-level="2"><a href="Item 1">Item 1</a></li>
<li id="pageid4653" data-pageid="4653" data-level="2"><a href="Item 1">Item 1</a></li>
</ul>
</li>