Question

I have the follow list that I need to be able to hide all accept for what is actually in focus with class active.

 <Ul>
        <Li>something</li>
          <ul>
           <li>Something</>
           <li>Something</>
          </ul>
        <Li>something</li>
        <Li>something</li>
        <Li>
            <Ul>
                <Li class="active">something</li>
                <Li>omething</li>
            </Ul>
        </li>
        <Li>something</li>
    </Ul>

I need to be able to use .hide() on all li that are not related to the bottom level one with the active class

The result would be

<Ul>
  <Li>something</li>
  <Li>something</li>
  <Li>something</li>
    <Li>
        <Ul>
            <Li class="active">something</li>
            <Li>omething</li>
        </Ul>
    </li>
  <Li>something</li>
 </Ul>

Answer 1

You can traverse up the DOM yo find the first level li element and its siblings. If you have only two levels, this should work:

$('li.active').parent().closest('li').siblings().children('ul').hide();

If you have more than two levels, I suggest to give the root ul a class or ID:

$('li.active').closest('#root > li').siblings().children('ul').hide();