Home/ Questions/Q 8153073
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-06T15:54:01+00:00

I have a div with multiple lis and each li contains ul. I want

  • 0

I have a div with multiple lis and each li contains ul. I want to independently toggle each li. like if I click on a link it should only toggle the ul of that group, Hope the below code will clear things more than my words.

<div id="sortable" style='width:700px; margin: 0 auto; border:2px solid; border-color:grey;'>
 <li class="ui-state-default"><a href='#' id='expand'> Group 1</a>
    <ul style= 'display:none' class='patents' id="sortable">
        <li id ='1' class="ui-state-default">Item 1</li>
        <li id ='2' class="ui-state-default">Item 2</li>
        <li id ='3' class="ui-state-default">Item 3</li>
    </ul>
 </li>
 <li class="ui-state-default"><a href='#' id='expand'> Group 2</a>
    <ul style= 'display:none' class='patents' id="sortable">
        <li id ='4' class="ui-state-default">Item 4</li>
        <li id ='5' class="ui-state-default">Item 5</li>
        <li id ='6' class="ui-state-default">Item 6</li>
    </ul>
</li>

The script is 

 <script>
  $(document).ready(function() {
    $('#expand').click(function() {
        $('.patents').toggle('slow', function() {
                    //instead of patents i need something unique 
        });
    });
});
</script>

If I click on group 1 the item 1,2,3 should toggle , if I click on group2 then Item 4,5,6 should toggle how can I achieve that?

Thanks

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You should put class=”expand” instead of id=”expand” on the top-level

  2. (you shouldnt have repeated ids anyway).

    3. Then use a class selector “.” instead of id “#” and select only “.patents” which are children of the element clicked

       $(document).ready(function() {
    $('.expand').click(function() {
         $(this).next().toggle('slow', function() {
                    //instead of patents i need something unique
        });
    });
});
  • 0