[set className vs color directly]

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:  

[set className vs color directly]

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

 

See the Pen mdbERbO by DickeySingh (@DickeySingh) on CodePen