将div向后移动为向前移动的相同路径

Question

我有四个位置让圆圈div朝着鼠标点击移动，我想让它在点击上一个圆圈时通过相同的路径向后移动..

这里的HTML

<div id="box">
        <div class="circle active" id="c"></div>
        <div class="circle" id="c1"></div>
        <div class="circle" id="c2"></div>
        <div class="circle" id="c3"></div>
        <div class="circle" id="c4"></div>
</div> 

这个拖曳功能可以向前和向后移动圆圈

var current = $('#c'), past;
function forward(){
            $('.circle').click(function (event){                 
                $(this).addClass('active');
                var x = event.pageX,
                    y = event.pageY;
                past = current;
                current = $(this);

                $('#c').animate({
                    top: y - 207,
                    left: x - 207
                }, 500);                   
            });              
        };
        function backword(){
            $('.circle').click(function (){                  
                   $('#c').animate({
                        //How to use prevUntil the circle that clicked  here 
                   }, 1000);
            });
        };

我尝试多次使用PrevUntil（）但我有语法问题.. 如何让圆圈回到已经过去的同一个圈子上？

样本 https://jsfiddle.net/mr2u9v7L/