Thimey

Hi! Thanks for getting back to me. Yes, I had a look a the to and from methods and thought this was the obvious answer, but could not get it to work. I suspect that everytime I replace the html inside the content-container, I am removing a reference to the element to the dynamic-content div. Therefore, I thought it might work by getting a new reference on the click handler function, but still no luck. Here is a link to a demo on codepen: http://codepen.io/Thimey/pen/oLOLxj?editors=1111 So when I click on the content, I want it to randomly populate the div with content from the array and transition with an animation --> Fade out to the left and Fade in from the right. Thanks for your time!

Hi everyone, I am a bit new to GSAP, so forgive me if this is a silly question. I am trying to add a leaving animation and enter animation on html content that I am replacing with Jquery's .html() method. When I click the element, the contents of that element is replaced with new content that is contained within a div with class="changing-content". I would like the old content to animate off the screen and the new content to animate onto the screen. JS: $('.content-container').click(changeHtml); function changeHtml () { var newHtml = ` <div class="changing-content"> //Some new content is interpolated here from an object </div> `; $('.content-container').html(newHtml); } HTML: <div class="content-container"> //new content goes here </div Any help will be greatly appreciated! Cheers