CSS / Javascript Show / Hide DIV using a CSS class?

Question

I\'ve googled around and found many scripts for hiding and showing DIV contents, as a toggle on button click.

But they are work using ID\'s.

I would like to

Answer 1

As others have said several times, this is easy in jQuery using a jquery selector and the .hide method. However, since you are asking in a general sense and it is a good idea to know how to do it without a framework, that isn't a complete answer.

Here are your options:

1. JQuery Method. Just use jQuery selectors and the .hide() method.

   $(".CLASSNAME").hide()

2. Vanilla JS: Dynamic CSS. One approach is to dynamically append stylesheets to the document head -- you can Alter CSS class attributes with javascript?

3. Vanilla JS: Modify CSS directly:

       var ss = document.styleSheets;
       for (var i=0; i