[jQuery] Selecting the current (this) dt on a collapsible menu
I adapted John's example of a collapsible menu but have a problem
selecting the current dt.
John's example can be found at: http://jquery.com/files/demo/dl-done.html
I pretty much has this so far:
<pre>
<script>
$(document).ready(function(){
$("div#Kcleftnav dt").addClass("productList");
$("div#Kcleftnav dd").hide();
$("div#Kcleftnav dt a").click(function(){
$("div#Kcleftnav
dt:first").removeClass("productList").addClass("menuSelected");
$("div#Kcleftnav dd:visible").slideUp("normal");
$(this).parent().next().slideDown("normal");
return false;
});
});
</script>
</pre>
As you can see on the fifth line, I remove the existing class that I
assigned to the menu and change the class so I can add a different
icon to the current dt tag. unfortunately I don't know how to say,
"only do it to this dt"
I also ran into the problem if once I think on another title (dt) the
previous one remains with the unchange icon, which looks like it's
open but is not.
Pretty much I only wanted to add a plus and minus to the left of each
dt on John's example.
I know I right now say on line 5: "div#Kcleftnav dt:first", and is
not :first that I need but something like :this, I even tried but it
doesn't work, I also changed the whole "div#Kcleftnav dt:first" for
(this) but it didn't work either.
"div#Kcleftnav dt:first" seems to be the closes to what I want but
only work and changes the icon on the first dt of the list, I want it
to be the one that they click, no just the first one.
Any help with me appreciated guys,
thanks!
J.