Jump to content

Want To Change A Class Attribute With A Click


fastrpn
 Share

Recommended Posts

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.

Link to comment
Share on other sites

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.

Link to comment
Share on other sites

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");});

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...