jquery - Show options of selected options inside the same <div> -


there unordered list of 3 items, a,b , c inside <div>. if select option a, should again show list of p, q , r inside same <div> , if select b, should show unordered list of x,y , z plus should have button well.

<div>     <ul>         <li><a href="#">a</li>         <li><a href="#">b</li>         <li><a href="#">c</li>     </ul> <div> 

now upon selecting option a, following list should displayed inside same <div>

    <ul>         <li><a href="#">p</li>         <li><a href="#">q</li>         <li><a href="#">r</li>     </ul> 

and this, upto 3-4 levels down, eg:- from a->p,q,r. from p->d,e,f. from d->s,r,t , similarly. should displayed inside same <div> tag.

i have searched bootstrap didnt got expected result. can done in bootstrap. if not, how can approach problem in jquery?

if looking tree view layout using jquery, try code:

$('.tree li').each(function(){         if($(this).children('ul').length > 0){                 $(this).addclass('parent');              } });  $('.tree li.parent > a').click(function(){         $(this).parent().toggleclass('active');         $(this).parent().children('ul').slidetoggle('fast'); }); 

demo , source: http://www.webstutorial.com/jquery-treeview-list/jquery


Comments

Popular posts from this blog

c++ - Linked List error when inserting for the last time -

java - activate/deactivate sonar maven plugin by profile? -

java - What is the difference between String. and String.this. ? -