Hiding all elements with the same class name?

Question

I'm trying to hide elements with the same class name (float_form), but I'm also trying to use the script below to show them (all of the float_form class divs are initially hidden). I've looked at a lot of jquery solutions, but I can't seem to make any of them work for this. ``` function show(a) { var e = document.getElementById(a); if (!e) return true; if (e.style.display == "none") { e.style.display = "block" } else { e.style.display = "none" } return true; } ``` Edit: Sorry if it wasn't clear, I do not intend to use Jquery(and I know that this is not jquery). I am looking for a way to use javascript to recognize repeated classnames that are not in style= display:none; without compromising the show/hide ID element since there is a loop with the div id as the key. The html for the div looks like below, with {item.ID} being a while loop. ```

Accepted Answer

vanilla javascript

```
function toggle(className, displayState){
    var elements = document.getElementsByClassName(className)

for (var i = 0; i < elements.length; i++){
        elements[i].style.display = displayState;
    }
}

toggle('float_form', 'block'); // Shows
toggle('float_form', 'none'); // hides
```

jQuery:

```
$('.float_form').show(); // Shows
$('.float_form').hide(); // hides
```

Hiding all elements with the same class name?

Solution

Problem