title: Display certain items of a WordPress menu
body: <p>I generate a menu in Wordpress that has three layers. I do that with the code:</p>
  
  <pre><code>wp_nav_menu(array('theme_location' =&gt; 'primary', 'menu_class' =&gt; 'SecondaryNavigation'));
  </code></pre>
  
  <p>Wordpress generates a menu like this:</p>
  
  <pre><code>&lt;div class="menu-mainnavigation_de-container"&gt;
  &lt;ul id="menu-mainnavigation_de" class="SecondaryNavigation"&gt;
      &lt;li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-39"&gt;
          &lt;a href="http://localhost/fecheriye/de/einfuehrung/"&gt;Home&lt;/a&gt;
          &lt;ul class="sub-menu"&gt;
              &lt;li id="menu-item-44" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-44"&gt;&lt;a href="http://localhost/fecheriye/de/einfuehrung/"&gt;Einführung&lt;/a&gt;&lt;/li&gt;
              &lt;li id="menu-item-43" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-43"&gt;&lt;a href="http://localhost/fecheriye/de/aktuelles/"&gt;Aktuelles&lt;/a&gt;&lt;/li&gt;
          &lt;/ul&gt;
      &lt;/li&gt;
      &lt;li class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-30 current_page_item current-menu-ancestor current-menu-parent current_page_parent current_page_ancestor menu-item-has-children menu-item-40"&gt;
          &lt;a href="http://localhost/fecheriye/de/beschreibung/"&gt;Der Tell&lt;/a&gt;
          &lt;ul class="sub-menu"&gt;
              &lt;li id="menu-item-42" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-30 current_page_item menu-item-42"&gt;&lt;a href="http://localhost/fecheriye/de/beschreibung/"&gt;Beschreibung&lt;/a&gt;&lt;/li&gt;
              &lt;li id="menu-item-41" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-41"&gt;&lt;a href="http://localhost/fecheriye/de/topographie/"&gt;Topographie&lt;/a&gt;&lt;/li&gt;
          &lt;/ul&gt;
      &lt;/li&gt;
      &lt;li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-51"&gt;
          &lt;a href="http://localhost/fecheriye/de/forschungsgeschichte/"&gt;Forschung&lt;/a&gt;
          &lt;ul class="sub-menu"&gt;
              &lt;li id="menu-item-53" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-53"&gt;&lt;a href="http://localhost/fecheriye/de/forschungsgeschichte/"&gt;Forschungsgeschichte&lt;/a&gt;&lt;/li&gt;
              &lt;li id="menu-item-52" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-52"&gt;&lt;a href="http://localhost/fecheriye/de/forschungsprobleme/"&gt;Forschungsprobleme&lt;/a&gt;&lt;/li&gt;
          &lt;/ul&gt;
      &lt;/li&gt;
      &lt;li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-65"&gt;
          &lt;a href="http://localhost/fecheriye/de/kampagnen/"&gt;Kampagnen&lt;/a&gt;
          &lt;ul class="sub-menu"&gt;
              &lt;li id="menu-item-64" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-64"&gt;
                  &lt;a href="http://localhost/fecheriye/de/ausgrabung-2010/"&gt;Ausgrabung 2010&lt;/a&gt;
                  &lt;ul class="sub-menu"&gt;
                      &lt;li id="menu-item-63" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-63"&gt;&lt;a href="http://localhost/fecheriye/de/grabungsstelle-c-haus-i-sq-6644-5-6744-6-6844-6/"&gt;Grabungsstelle C &amp;#8211; Haus I (Sq. 6644-5, 6744-6 &amp;#038; 6844-6)&lt;/a&gt;&lt;/li&gt;
                  &lt;/ul&gt;
              &lt;/li&gt;
          &lt;/ul&gt;
      &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p></p>
  
  <p>I have to divide the menu into two menues: In the header on the top, only the first layer of the menu is visible. This is very easy with the depth-call of wp_nav_menu and works just fine.
  In the Sidebar I want to display the corresponding second and third level (everything under the class .sub-menu) of the menu, depending what was selected in the header. I tried to do this via CSS with the two simple lines:</p>
  
  <pre><code>.SecondaryNavigation {
    display: none;
    }
  
  .SecondaryNavigation .current-menu-ancestor .sub-menu {
    display: block;
    }
  </code></pre>
  
  <p>Unfortunately, this does not work. How can I display only the second and third level of my menu, depending on what was selected in the primary level? Wordpress assigns the corresponding classes, like .current-menu-ancestor or .sub-menu, so it must be possible in some way, right?</p>
  
  <p>Thanks for your help!
  All the best
  Sebastian</p>