Jquery 滑动按钮上的下一个div单击

我正试着按一下按钮把一个div滑过去

我通过单击div本身使其工作

我尝试将

.box

更改为

按钮
，并将
$（此）更改为$（'.box'）
，但随后所有div似乎都滑过了，而不仅仅是下一个div

我是jquery/javascript新手，曾尝试过搜索一系列不同的解决方案，但我不知所措，我相信这是非常简单的


$（'.box'）。单击（函数（）{
$（此）。设置动画({
左：“-50%”
}，500，函数（）{
$（this.css（'left'，'150%'）；
$（this）.appendTo（“#滑盒容器”）；
});
$（this）.next（）.animate({
左：“50%”
}, 500);
});
#滑盒容器{
位置：相对位置；
边际：0px；
填充：0px；
宽度：100%；
高度：400px；
溢出：隐藏；
}
.盒子{
位置：绝对位置；
宽度：50%；
高度：300px；
线高：300px；
字体大小：50px；
文本对齐：居中；
边框：2件纯黑；
左：50%；
顶部：100px；
左边缘：-25%；
}
#框1{
背景色：#333；
左：50%；
}
#框2{
背景色：#333；
左：150%；
}
#框3{
背景色：#333；
左：150%；
}
#方框4{
背景色：#333；
左：150%；
}
#方框5{
背景色：#333；
左：150%；
}

第1分部
第2分部
第3分部
第4分部
第5分部
按钮
我为u。这将使它与您当前的设置工作

<script>
var boxvar = 1;
$(document).ready(function(){
    $('.clickMe').click(function() {
    $('#box' + boxvar).animate({
        left: '-50%'
    }, 500, function() {
        $('#box' + boxvar).css('left', '150%');
        $('#box' + boxvar).appendTo('#slide-box-container');
        if(boxvar != 5){
        boxvar += 1;
        }else{
        boxvar = 1;
        }
    });

    $('#box' + boxvar).next().animate({
        left: '50%'
    }, 500);
});
});
</script>


var-boxvar=1；
$（文档）.ready（函数（）{
$（'.clickMe'）。单击（函数（）{
$（'#box'+boxvar）。设置动画({
左：“-50%”
}，500，函数（）{
$（'#box'+boxvar）.css（'left'，'150%'）；
$（“#盒”+boxvar）.appendTo（“#滑盒容器”）；
如果（boxvar！=5）{
boxvar+=1；
}否则{
boxvar=1；
}
});
$（'#box'+boxvar）.next（）.animate({
左：“50%”
}, 500);
});
});
哇，谢谢！这样做更有意义。没问题，很乐意帮忙：D