Tem que utilizar o querySelectorAll
em vez de querySelector
a diferença é que ele pega todas as ocorrências e não apenas uma (no caso o primeiro span
).
var menuTabs = document.querySelectorAll('#menuMobileTabs span');
for(i = 0; i < menuTabs.length; i++)
{
menuTabs[i].classList.add("tag-active");
}
.tag-active {
color:red;
}
<div id="menuMobileTabs">
<span>Siber</span>
<span>Rede Sociais</span>
<span>Menu</span>
<span>Search</span>
</div>
Pode trabalhar de maneira resumida:
document.querySelectorAll('#menuMobileTabs span').forEach(function(el)
{
el.classList.add("tag-active");
});
.tag-active {
color:blue;
}
<div id="menuMobileTabs">
<span>Siber</span>
<span>Rede Sociais</span>
<span>Menu</span>
<span>Search</span>
</div>
Referencias