How to do mutiple css class in one line javascript code

Question

I have css class names - .exp-1 , .exp-2, .exp-3 , exp-4 ... so is there any simple way to write these all in onlike line like ,I m beginner to javascript

document.getElementsByClassName("exp-1")[0];
document.getElementsByClassName("exp-2")[0];
document.getElementsByClassName("exp-3")[0];
document.getElementsByClassName("exp-4")[0];

to

 document.getElementsByClassName("exp-1,exp-2,exp-3, exp-4")[0];

Answer 1

You can use querySelector and then use css like selectors. It returns the first element of all selected elements. If you want to return all you can use querySelectorAll

 document.querySelector(".exp-1,.exp-2,.exp-3,.exp-4");

Answer 2

You can use starts with selector

document.querySelectorAll('[class^=exp-]')

Sample

 Array.from(document.querySelectorAll('[class^=t]'), function(el) { console.log(el.innerHTML) }) 

 <div class="t1">1</div> <div class="t2">2</div> <div class="t3">3</div> <div class="t4">4</div>