Tem que utilizar o [`querySelectorAll`][1] em vez de [`querySelector`][2] a diferença é que ele pega todas as ocorrências e não apenas uma (no caso o primeiro `span`). <!-- begin snippet: js hide: false console: true babel: false --> <!-- language: lang-js --> var menuTabs = document.querySelectorAll('#menuMobileTabs span'); for(i = 0; i < menuTabs.length; i++) { menuTabs[i].classList.add("tag-active"); } <!-- language: lang-css --> .tag-active { color:red; } <!-- language: lang-html --> <div id="menuMobileTabs"> <span>Siber</span> <span>Rede Sociais</span> <span>Menu</span> <span>Search</span> </div> <!-- end snippet --> ---------- Pode trabalhar de maneira resumida: <!-- begin snippet: js hide: false console: true babel: false --> <!-- language: lang-js --> document.querySelectorAll('#menuMobileTabs span').forEach(function(el) { el.classList.add("tag-active"); }); <!-- language: lang-css --> .tag-active { color:blue; } <!-- language: lang-html --> <div id="menuMobileTabs"> <span>Siber</span> <span>Rede Sociais</span> <span>Menu</span> <span>Search</span> </div> <!-- end snippet --> **Referencias** - [Element.classList][3] - [querySelectorAll][1] - [Loop Over querySelectorAll Matches][4] [1]: https://developer.mozilla.org/pt-BR/docs/Web/API/Document/querySelectorAll [2]: https://developer.mozilla.org/pt-BR/docs/Web/API/Document/querySelector [3]: https://developer.mozilla.org/pt-BR/docs/Web/API/Element/classList [4]: https://coderwall.com/p/jcmzxw/iterate-over-queryselectorall-result