jQuery Accordion for Wordpress

So I was working on a site with a vertical navigation today and the previous developer working on it made the entire navigation static….Well thats pretty much worthless for a CMS like Wordpress. So I took it upon myself to create an accordion script for Wordpress (it can be used wtihout Wordpress just as easily). I commented the code nicely and you can essentially paste this directly into wordpress and it will work.

The File Structure is as follows

<ul>
   <li><a href="http://link"></a>
        <ul>
            <li><a href="http://subnavlink">LINK</a></li>
        </ul>
   </li>
</ul>

The CSS You will need

#navigation ul li ul { display:none; }
#navigation .displayMe { display:block; }

Now for the Javascript. This one is for all your Wordpress Developers who need a custom jQuery Accordion

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js"></script>
<script type="text/javascript">

$(document).ready(function() {	

//If its a page parent (based off wordpress), add the class "displayMe"
//This way the accordion will be opened up on the page you are on.
if ($('#navigation ul li').hasClass("current_page_parent")) {
	$('#navigation .current_page_parent ul').addClass("displayMe"); }

//Hide the submenus
$('#navigation ul li ul').hide();

//Add a class to the parent li IF it has sub UL's
$("#navigation ul li:has(ul)").addClass("theDon");

//Da henchman
$("#navigation ul li ul li:has(a)").addClass("henchmen");

//Remove the link if it has a submenu
$('#navigation .theDon > a').attr('href', '#');

//When you click it, toggle bitch.
$('#navigation ul li a').click(
function() {

//Onclick Remove the class dipslay me which is only display:block;
//This way they can close it if they click it or it will glitch
$(this).next().slideToggle('slow').removeClass("displayMe");

//return false so the # doenst move view to the top of the page
if ($(this).attr('href') == '#') { return false; }

//Close it all out
	});
 });

</script>

<div id="navigation">
<ul>
<?php wp_list_pages('title_li='); ?>
</ul>
</div>

Hope this jQuery Accordion with an emphasis for Wordpress helps!

Cheers,
-Wes