Only the first class 'word_split' applies. What should I do if I want to break all the other classes?

Question

Only the first class 'word_split' applies. What should I do if I want to break all the other classes?

<script>

var textWrapper = document.querySelector('.word_split');
textWrapper.innerHTML = textWrapper.textContent.replace(/\S/g, "<span class='letter'>$&</span>");

</script>

Answer 1

You can do something like this -

var textWrappers = document.getElementsByClassName('word_split');
for (var i = 0; i < textWrappers.length; ++i) {
    var item = textWrappers[i];  
    item.innerHTML = item.textContent.replace(/\S/g, "<span class='letter'>$&</span>");
}