<link href='//fonts.googleapis.com/css?family=Signika+Negative:300,400' rel='stylesheet' type='text/css'>
<div class="box green"></div>
<div class="nav">
    <button id="restart">play again</button>

    <button id="invalidate">invalidate and play again</button>

  
/* Global styles come from external css https://codepen.io/GreenSock/pen/JGaKdQ*/


body {
  margin:10px;
}

button {
  display:inline;
}
var t = TweenLite.to(".green", 1, {x:"+=100"});

$("#restart").click(function(){
  t.restart();
})

$("#invalidate").click(function(){
  t.invalidate();
  t.restart();
})

External CSS

  1. https://codepen.io/GreenSock/pen/JGaKdQ

External JavaScript

  1. https://cdnjs.cloudflare.com/ajax/libs/gsap/1.20.4/TweenMax.min.js?v=2342
  2. https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js