Want To Change A Class Attribute With A Click

[fastrpn]

If my question sounds remarkably like the previous one, it is a coincidence. I've been searching this site for weeks, looking for an answer to my question and here it is, basically, although it doesn't seen to work. This is my first post, so I'll go ahead since my approach is quite different. I’m doing a calendar with events that are defined by html class; fitness events are red, education events are blue/bold, admin events are green, holidays are pink, etc.I want to make any class of event disappear with an onclick to isolate various classes of elements. Click a button and Admin goes away. Click another button and Fitness goes away. All you see is Education and Holidays. Click them all on, and you can see them all. The js toggling onclick part was easy.But everything I read says that, to change a style for an element, you get its id (document.getElementById) and do whatever you want. But I don’t want to name each element with a different id; fitness1 to fitness99, education1 to education99 and then change each set. I’d have to change the code each time I add or delete a calendar event.So, how do I change an attribute (display: none) for a class of item?If anyone responds with a better approach (like with objects, which I haven’t exactly mastered yet), can you still help me find the method for changing the class attribute anyway? It could be helpful in the future.Thank you for your time.

[justsomeguy]

jQuery can get elements by class name, or else you can use document.getElementsByTagName and loop through all of the elements looking for ones with your class name.

[fastrpn]

Thanks for pointing me in the right direction. I had never heard of jQuery before, but now that I can spell it correctly most of the time, I consider myself an expert in it. Will there be no end to my education? This is pretty much what I had in mind, considering this is the first working version. http://thelakesoftempe.com/calendarthis.htmlThanks for your input.

[Krupa]

If you're using jQuery, you could do something like this. Set up another class for the hidden events; this is what the original class will change to. Then you could do something like:

$(".class_selector").click(function(){	$(this).toggleClass("new_class");});