Toggle Jquery Script with no spec. ul class

Question

i have searched here for hours, but none of these jquery scripts explained, to toggle a simple menu with list childs, worked for me. i like to toggle the childs, with help from css.

i have a wordpress menu & the html look like this: (the ul parent element has no class/ or id)

<nav class="nav" role="navigation">
  <div class="menu">
    <ul>
      <li class="page_item page-item-4"><a href="#">Aktuell</a></li>
      <li class="page_item page-item-211 page_item_has_children current_page_item">
        <a href="#">Liquida</a>
        <ul class="children">
          <li class="page_item page-item-222"><a href="#">lager1</a></li>
          <li class="page_item page-item-213"><a href="#">lager2</a></li>
          <li class="page_item page-item-219"><a href="#">lager3</a></li>
        </ul>
      </li>
      <li class="page_item page-item-4444"><a href="#">Last</a></li>
      <li class="page_item page-item-92"><a href="#">Lieferung</a></li>
    </ul>
  </div>
</nav>

to show that the first ul has no class name nor id name, for me this is the problem that i have with this.

Adrian Tombu · Accepted Answer · 2014-07-14T18:11:24.447

0

Just test if you have a ul.children next to the link you click on, it should do the trick.

In CSS

.children { display: none; }

in jQuery

$('.menu a').click(function(e){
    var childrenList = $(this).next('.children');

    if(childrenList.length) {

        $(childrenList).toggle();
        e.preventDefault();
    }
});

See JSFiddle

edited Jul 14 '14 at 18:11

answered Jul 14 '14 at 17:54

Adrian Tombu

696
6
11

Thank you - it works. (what means the .lenght array in this code?) – stevethemechanic Jul 14 '14 at 18:19
You can find more informations about it [in this conversation on StackOverflow](http://stackoverflow.com/questions/31044/is-there-an-exists-function-for-jquery) :) – Adrian Tombu Jul 14 '14 at 18:23
is there a way to have the toggle closed per default (@ opening index.php)? – stevethemechanic Jul 14 '14 at 20:24
The line of CSS in my answer does the work ;) – Adrian Tombu Jul 14 '14 at 21:20
thats true, there was a little error on my css, thanks again! – stevethemechanic Jul 14 '14 at 23:09
Hi - I like to ask you is it possible to have the menu stay open after click a link in the dropdown? thanks again if you see the question and thanks a lot for helping anyway!! – stevethemechanic Aug 17 '14 at 23:53

Toggle Jquery Script with no spec. ul class

1 Answers1