javascript - wrap code by promises -

i use gsap library animation. trying wrap promises:

$().promise().then(function() {      var timeline = new timelinemax();     timeline.to( $('.box'), 0.5, {css: {boxshadow: '0 0 40px 40px red'}}, 'box' )             .to($('.box'), 0.5, {css: {boxshadow: 'none'}}, 'box+=5')  }) .then(console.log(1)) 

but, console.log run @ start. how fix it?
demo

you should use $.deferred() promise object.

jquery.deferred()

a constructor function returns chainable utility object methods register multiple callbacks callback queues, invoke callback queues, , relay success or failure state of synchronous or asynchronous function.

more

var dfd = $.deferred();  var timeline = new timelinemax();  timeline.to( $('.box'), 0.5, {css: {boxshadow: '0 0 40px 40px red'}}, 'box' )         .to($('.box'), 0.5, {css: {boxshadow: 'none'}}, 'box+=5');  // when animation ended should call dfd.resolve()  dfd.done(function() {     alert("succeeded"); });