Animate multiple svg icons same class with ScrollTrigger

[sledder]

Hello - new to gsap, have read & watched documentation videos and searched but I am stuck and hoping someone can help. I'm trying to animate icons as they are either in-view when the page loads or else when they come into view during scroll. I've only been able to trigger all the icons at once when the first one hits the start point. Ideally any icon visible on page load would animate immediately, and subsequent icons would animate as they come into view. Any help would be greatly appreciated. Icons not in view on load would preferably be hidden (which I can do via css) but not sure where to set the visibility while using ScrollTrigger and DrawSVG. Many thanks!

See the Pen yLPPdgq?editors=0110 by sledder07 (@sledder07) on CodePen

[OSUblake]

Welcome to the forums @sledder

 

You had some syntax errors with your arrow function, but is this what you are going for.

 

See the Pen XWzzLLW by GreenSock (@GreenSock) on CodePen

 

[sledder]

@OSUblake, rockstar man, thank you so much!!