Determine parent div of an unordered list

[rogerte]

I have an unordered list based accordion style menu which is included on every SHTML page. There is a function that identifies the <li><a...> element and colours it. There are 2 "dropdowns", each being in a <div> with a unique id. There are also some <li><a...> elements that are not within the dropdown <div>s (See below)

<ul>
<li><a style="color: #000000" ref="index.shtml">Home</a></li>
<li style="background-color: #a9acb6;"><a style="color:#000000" href="#" onclick="toggle_div('div1');">Dropdown1</a></li>
  <div id="div1" style="display:block;">
  <ul>
  <li><a style="padding-left:13px;color: blue" href="item1.shtml">Item1</a></li>
  <li><a style="padding-left:13px;color: blue" href="item2.shtml">Item2</a></li>
  <li><a style="padding-left:13px;color: blue" href="item3.shtml">Item3</a></li>
  </ul>
  </div>
<li style="background-color: #a9acb6;"><a style="color: #000000" href="#" onclick="toggle_div('div2');">Dropdown2</a></li>
  <div id="div2" style="display:none;">
  <ul>
  <li><a style="padding-left:13px;color: blue" href="itemA.shtml">ItemA</a></li>
  <li><a style="padding-left:13px;color: blue" href="itemB.shtml">ItemB</a></li>
  <li><a style="padding-left:13px;color: blue" href="itemC.shtml">ItemC</a></li>
  </ul>
  </div>
<li><a style="color: #000000" href="ItemX.shtml">ItemX</a></li>
<li><a style="color: #000000" href="ItemY.shtml">ItemY</a></li>
<li><a style="color: #000000" href="ItemZ.shtml">ItemZ</a></li>
</ul>

When the page loads I wish to identify which div is the parent of the page's <li><a..>

e.g. If the page loaded is ItemB.html then I need to know the <div> id is "div2".

I am going round in circles trying to sort this out - can anyone help please?

 

[BillyRayPreachersSon]

While this doesn't answer your question, I would strongly advise you do this server-side, and not client-side.

Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

Dan's Page [blue]@[/blue] Code Couch:

http://www.codecouch.com/dan/

Code Couch Tech Snippets & Info:

http://www.codecouch.com/

 

[rogerte]

Thanks for reply.

Unfortunately new to all this stuff so am on a learning curve with client-side before I even look at server-side.

However I solved my problem by using a bit of a kludge. I uses ids of asubdiv, bsubdiv, csubdiv etc for all the submenu divs. Then for each <a> link in a div I used the inital letter of the <div> (a, b. c etc)followed by a number. Then in the onload I checked for the page name in the <a> reference, and then used the first letter of the id plus "subdiv" to search for the appropriate div which I then set display to block.

As long as no other divs use the "subdiv" id it works fine.

Not elegent, but works.