Target css class with javascript

[trx]

Hoping to get some assistance - Jeepstone sent me along here as I used to be his monkey until he departed for pastures new

<li id="menuitem_4_private" class="mainlevel_active_private"><a id="menulink_4_private" class="mainlevel_active_private" href="#">Portfolio</a>
<ul id="menulist_4_private" style="visibility: hidden; top: 87px;">
<li id="menuitem_4_1_private" class="sublevel_private">
<a id="menulink_4_1_private" class="sublevel_private" href="#">Testimonials</a></li>
<li id="menuitem_4_2_private" class="sublevel_current_private">
<a id="menulink_4_2_private" class="sublevel_current_private" href="#">Case Studies</a></li><li id="menuitem_4_3_private" class="sublevel_private"><a id="menulink_4_3_private" class="sublevel_private" href="#">Gallery</a></li>
</ul>
</li>

This is a section of my menu and I wish to target the <ul> below "mainlevel_active_private" depending on which menu item is active tried various things such as mootools etc. My menu is rendered in Joomla and makes use of "easymenu".

Richard

[Rosco]

Hi Richard, and welcome to DDN

To target that ul in javascript you can grab it by its id, like this:

document.getElementbyId('menulist_4_private')

hope this helps

[trx]

That does help but the active ul changes from page to page which I wish to target

[Jeep Stone]

Rich,

If you're using Sam's easymenu, can you not modify the code to also add a class when you add the visibility?

[Charisma Bypass]

And make sure that if you are using EasyMenu, that you
pay for a license or provide a backlink (if it's a personal site).

Oh, and what JeepStone said - seems easiest.

[trx]

I could do that but it has an inline style which would overide the css class but i guess i could drop the inline styles and do it using classes?

[Charisma Bypass]

You coudl maybe do something with jquery, based on the "style" attribute?  Have a hunt in Google.

[trx]

In the end I went with the yahoo ui libary which seems pretty good for this type of thing it involves;

li = YAHOO.util.Dom.getElementsByClassName('mainlevel_current_private', 'li')[0];
ul =  YAHOO.util.Dom.getLastChild(li);
YAHOO.util.Dom.setStyle(ul, 'visibility', 'visible');

This has got me pretty close just doing a few tweeks now

[Jeep Stone]

There's something like getElementsByClassName in most of the frameworks, just called something different.

[trx]

There is also something similar in prototype libary its just that yahoo was the easiest to get up and running.