javascript - How to change the style of elements with same class name

Question

Using javascript, I want to change the style of class .s into

.s {
  display: block;
}

Why this cannot work:

document.getElementsByClassName('s').style.display='block';

Answer 1

document.getElementsByClassName: returns a set of elements which have all the given class names.

You may have multiple elements with this class name. so you need to provide index like

document.getElementsByClassName('s')[0].style.display='block';

Inorder to apply for style for all elements with same class name:

var ele = document.getElementsByClassName('s');
for (var i = 0; i < ele.length; i++ ) {
    ele[i].style.display = "block";
}