CODEWITHSUNDEEP
reactjsgsaptoarray
Alexandre PUJOL
Alexandre PUJOL

Reputation: 150

REACTJS - GSAP "toArray" function doesn't work well with dynamic tagging

I'm trying to do a simple animation where every word of one paragraph appears one after the other but I'm struggling with gsap.utils.toArray function.

I'm first using a small js function to separate every words of a paragraph into unique divs :

   const awards = document.querySelectorAll('.Awards p');

for(let i = 0; i < awards.length; i++){
  awards[i].innerHTML = awards[i].innerText.split(/\s/).map(function(word) {
  return '<div className = "word" >' + word + '</div>'
  }).join(' ')
}

Then I would like to regroup them all into a gsap Array thanks to this formula :

let words = gsap.utils.toArray('.word')

But when I try console.logging it, the array is just empty...

Does anyone has an idea what it could be ? Has anyone ever encountered a similar problem ?

Pleeeeeease help me 🙏

Good day or evening depending where you are :)

Upvotes: 1

Views: 531

Answers (0)

Related Questions