It would be easier to diagnose your issue if you shared read-only link of your project.
But anyway, I think I got the idea about your issue. You seems to have done just one simple mistake, I think you’ve placed your scripts inside < head> tag. So instead you should please it on the field below, Before </ body> tag field.
I have now managed to add a class using this javascript called “line” to each line within the paragraph, is there a way to target this class to animate it, or animate them as a child so I can add a delay to each line within webflow? The class hasn’t been created in webflow, only in the script.
Yes, any class that exists in your final HTML ( including those created by script ) can be styled and targeted with Interactions.
Drop an element of a similar kind on your form. e.g. text line, image, list or whatever.
Select it and create a Webflow class of exactly the same name, and case, as your script is creating. In your case that might be line, all lowercase.
Now, style it, or build Interactions based on that class.
Targeting should work fine. Note that you might encounter timing issues, since your scripts are creating those classes at the end of the page load. But I don’t think that will really matter for most Interactions particularly if they are element interactions like a click or mouseover.