Клавиши смены кнопок и начальная анимация

Question

У меня есть шаговый генератор, и у меня возникают проблемы с тем, чтобы снять секцию слайда, а затем кнопку шагов наверху нажата во второй раз.

Here's a link to a pen

Любые советы будут приветствовать

var hiddenSteps = ".hiddenSteps"; 

$(".expandButton").click(function() { 
    TweenMax.to(hiddenSteps, 0.5, {left:50, ease:Back.easeOut}); 
    $(this).addClass("collapseButton").removeClass("expandButton"); 
}); 
$(".collapseButton").click(function() { 
    TweenMax.to(hiddenSteps, 0.5, {left:-80}); 
    $(this).removeClass("collapseButton").addClass("expandButton"); 
}); 

Answer 1

Вы должны использовать метод .on(), как вы измените классы элементов динамически:

var hiddenSteps = ".hiddenSteps"; 

$(document).on('click', '.expandButton', function() { 
    TweenMax.to(hiddenSteps, 0.5, {left:50, ease:Back.easeOut}); 
    $(this).addClass("collapseButton").removeClass("expandButton"); 
}); 
$(document).on('click', '.collapseButton', function() { 
    TweenMax.to(hiddenSteps, 0.5, {left:-80}); 
    $(this).removeClass("collapseButton").addClass("expandButton"); 
}); 

http://codepen.io/anon/pen/zvqNjE