I've been going through various tutorials and demos of jQuery, and finding my way fairly well, at least with the basics.
To work my way through a few concepts , I put up a quick demo of a show/hide Faq-type system http://www.mredesign.com/demos/jquery-show-hide/ but as I did so, I had a question about changing classes that I'm hoping someone here can explain In this demo, I initially had any sibling element as clickable - so that any other element inside the 'offDiv' or 'onDiv' container would work to show or hide the 'show-hide' div, not just the little link button - and the heading div worked great.. but only for one click. I wanted to click the header (this worked), which would change the class of the container (this als worked), and then click again to close the box under rule for new parent class (this did not work). I was referencing the element by the parent container '.offDiv > .faqTitle' to open and change parent to 'offDiv', or '.onDiv > .faqTitle' to close and change parent to 'onDiv'. Both worked, but even though the parent class was changed, I could not click again for the opposite option. I understand I can use 'toggle', but was trying to get at it another way, using a method I've needed other places as well. I was under the impression I could change the class of the parent with a click, and then access the rule for a child of the new parent class.. but this does not seem to work as expected, almost like the browser needs a kick to refresh the DOM. I also had a 'show all' link which worked great - changing the class of all the current 'offDiv' containers to 'onDiv' which allowed them to be shown. But, like the above, even though the parent class was changed, I had to click twice on the button of a previously closed div to get it to close again.. somewhere, obviously, I am missing how this is supposed to work. The button links in my example seem fine, since they are actually two separate elements being shown/hidden depending on parent class. But.. what would be the correct way to let an element "click - change parent class - be affected by new rule under new parent - click again" ? Does it have to do with the order in which I call these functions? Is there some way to say 'hey! get the new DOM!' after something is clicked or changed? I hope this makes some kinda sense.
