selective cascading access on matching elements

selective cascading access on matching elements

Hello @all,

I´m very new to jQuery and have a problem I can´t solve by myself. I have an ul li list with items that match a later following div - the match is the id. That id is matching another following div by id. All elements are dynamically generated and can vary in depth. I have a working set with onclick fuctions, but I want to make this working in jQuery.  

It would be great if someone could help me to get this working !!

Thanks in advance

This is the raw template:

  1. <div class="mything">
  2.     <ul>
  3.         <li id="t232">
  4.             Headitem 1
  5.         </li>
  6.         <li id="t241">
  7.             Headitem 2
  8.         </li>
  9.         <li id="t250">
  10.             Headitem 3
  11.         </li>
  12.     </ul>
  13.     
  14.     <div id="p232">
  15.         Show if headitem 1 is clicked, hide if another headitem is clicked
  16.         
  17.         <div class="secondmenu items">
  18.             <div class="name" id="s232-233">
  19.                 If hovered show c232-233
  20.             </div>
  21.             
  22.             <div class="content" id="c232-233">
  23.                 some content
  24.             </div>
  25.         </div>
  26.         
  27.         <div class="secondmenu item">
  28.             <div class="name" id="s232-256">
  29.                 If hovered show c232-256
  30.             </div>
  31.             <div class="content" id="c232-256">
  32.                 some content
  33.             </div>
  34.         </div>
  35.             
  36.         <div class="secondmenu item">
  37.             <div class="name" id="s232-234">
  38.                 If hovered show c232-234
  39.             </div>
  40.             <div class="content" id="c232-234">
  41.                 some content
  42.             </div>
  43.         </div>
  44.         
  45.     </div>
  46.     
  47.     
  48.     <div id="p241">
  49.         Show if headitem 2 is clicked, hide if another headitem is clicked
  50.         
  51.         <div class="secondmenu items">
  52.             <div class="name" id="s241-213">
  53.                 If hovered show c241-213
  54.             </div>
  55.             <div class="content" id="c241-213">
  56.                 some content
  57.             </div>
  58.         </div>
  59.         
  60.         <div class="secondmenu item">
  61.             <div class="name" id="s241-256">
  62.                 If hovered show c241-256
  63.             </div>
  64.             <div class="content" id="c241-256">
  65.                 some content
  66.             </div>
  67.         </div>
  68.         
  69.         <div class="secondmenu item">
  70.             <div class="name" id="s241-277">
  71.                 If hovered show c241-277
  72.             </div>
  73.             <div class="content" id="c241-277">
  74.                 some content
  75.             </div>
  76.         </div>
  77.         
  78.     </div>
  79.     
  80.     and so on
  81.     
  82. </div>