DS1

Thanks @Shaun Gorneau, @ZachSaucier, and @GreenSock Still learning and assumed a Tween*.set() was not a tween but setting the initial starting state without a tween. I wanted to set common class stuffs without color in class and color in call. I'll skip className in tweens. Thanks again! Updated: https://codepen.io/DickeySingh/pen/mdbERbO

Still learning javascript and gsap, so don't judge! Why is d2 pink? style = document.createElement("style"); document.getElementsByTagName("head")[0].appendChild(style); style.innerHTML += " .d1 { font-name:'Arial'; font-style:italic; font-size: 48px; color: purple; }\n"; style.innerHTML += " .d2 { font-name:'Arial'; font-style:italic; font-size: 80px; }\n"; style.innerHTML += " .d3 { font-name:'Arial'; font-style:italic; font-size: 48px; color: purple;}\n"; function div(d) { var e = document.createElement("div"); e.setAttribute("id", d); document.getElementsByTagName("body")[0].appendChild(e); return d; } TweenMax.set("#"+div("d1"), {text:"d1", className:"+=d1"}); //purple TweenMax.set("#"+div("d2"), {text:"d2", className:"+=d2", color:"red"}); //pink??? TweenMax.set("#"+div("d3"), {text:"d3", fontSize:"60px", /*className:"+=d3",*/ color:"red"}); //red