如何在不同的事件中使用多个flexslider

Question

我在同一页面上使用两个flexsliders，但是在不同的事件中。两个flexsliders工作正常。但是第二个滑块在点击事件触发时第一次有一些混蛋。

$('#slider').flexslider({ 
    animation: "slide", 
    easing: "swing", 
    direction: "horizontal", 
    controlNav: true,  
    asNavFor: '#slider2',
    directionNav: true
});
$('.HowItWorks').click(function(){
    $('#slider2').flexslider({ 
        animation: "slide", 
        easing: "swing", 
        direction: "horizontal", 
        controlNav: true,  
        directionNav: true ,
        sync: "#slider"
    });
})