Reposting one more time. I need help fixing my accordion. I am nearly done making a very useful tool for the community.

Question

I am making a demo reference guide. I have around 17 accordions in this guide with FAQs. This can help the community have a specific guide to use to reduce FAQs and help educate the public. I have used the searchbar and I didn't find anything that matched the scope of this. If you have any suggestions, references, etc., it would be greatly appreciated. Thank you for your time.

https://www.sololearn.com/Discuss/2519708/?ref=app

Answer 1

I made them all fall under one class the 'accd' class to reduce repetitive code. So yes.

Answer 2

Yes. The first accordion buttons are changing to colors i didn't assign.

So: Why learn HTML, Why should I learn Javascript, e.g.

Answer 3

That is exactly the problem!

Answer 4

Thank you!! But why is this happening?? It doesn't happen for the other accordions. Very peculiar.

Answer 5

https://code.sololearn.com/W22axnxe69UB/?ref=app

So I retested, and I found that the accordions inherit the color change of the most recent accordion. Cool observation, but i want to keep the changes to the respective language accordion.

Answer 6

https://code.sololearn.com/WFtLQ8G5596K/?ref=app

Answer 7

Do all of the accordions fall under the one class 'accd' or are there other classes?

Answer 8

Are these the elements causing the problem? (just showing text and classNames)

Why learn HTML? accd haccordion
How to write in HTML? accd haccordion
Why should I learn Javascript? accd js_accordion
How to use Javascript? accd js_accordion
Why learn Python? accd Pyvs_accordion
Python Development Environment accd Pyvs_accordion
Why learn ruby? accd Rb_accordion
Development Environments for Ruby accd Rb_accordion
Why Learn Java? accd Jv_accordion
Java Development Environments accd Jv_accordion
Why Learn C Language? accd caccordion
Development Environments for C accd caccordion

Answer 9

They should be dark blue and #F7DB05 but instead, they turn white when active. Is that the problem?

Answer 10

At line 532(CSS) is the last time the active class was assigned a color(white) and that is the color that will be used when toggling the active class on any button element with an "accd" class name.

Change the color on line 532 to get a see the effect on the buttons.