css - Add Class using GetElementsByClassName JavaScript

Question

I am converting a jQuery site to vanilla javascript and am reaching out for advice on the best way to convert a simple line of jQuery to javascript.

The jQuery $(".div_class").css({ display: 'none' });

Any suggestions doing this in pure javascript using only classes would be very helpful.

Thanks

Answer 1

Try to use document.getElementsByName to get the required element,

[].slice.bind(document.getElementsByClassName("div_class"))().forEach(function(itm){
  itm.style.display = "none";
});

And convert it to an array by binding the array like object as a this value of slice and call it. Now iterate over the returned array and set its display property.

Also you can shorten it by using forEach directly,

[].forEach.bind(document.getElementsByClassName("div_class"),function(itm){
  itm.style.display = "none";
})();