Javascript 循环一个进度条-箭头类型

我有一个进度条，当它结束或开始之前，我想循环下一个和上一个链接。我不知道如何更改我的实际javascript来做到这一点：

jQuery( document ).ready(function() {

  var back =jQuery(".js-prev");
  var   next = jQuery(".js-next");
  var   steps = jQuery(".step");

  next.bind("click", function() { 
    jQuery.each( steps, function( i ) {
      if (!jQuery(steps[i]).hasClass('current') &&     !jQuery(steps[i]).hasClass('done')) {
        jQuery(steps[i]).addClass('current');
        jQuery(steps[i - 1]).removeClass('current').addClass('done');
    return false;
      }
    })      
  });
  back.bind("click", function() { 
    jQuery.each( steps, function( i ) {
      if (jQuery(steps[i]).hasClass('done') && jQuery(steps[i + 1]).hasClass('current')) {
        jQuery(steps[i + 1]).removeClass('current');
        jQuery(steps[i]).removeClass('done').addClass('current');
        return false;
      }
    })      
  });

})

我试图学习javascript，但实际上我真的很糟糕。。。该代码由格里戈里·波利诺夫斯基编写：

---

感谢您的帮助：）

需要更改当前步骤索引。在这种情况下，done类也没有任何意义–请尝试：

jQuery（文档）.ready（函数（）{
var back=jQuery（“.prev”）；
var next=jQuery（“.next”）；
var steps=jQuery（“.step”）；
next.bind（“单击”，函数（）{
jQuery.each（步骤、函数（i）{
if（jQuery（步骤[i]）.hasClass（'current'））{
jQuery（步骤[i]）.removeClass（'current'）；
jQuery（steps[i+1>steps.length-1？0:i+1]）.addClass（'current'）；
返回false；
}
})
});
back.bind（“单击”，函数（）{
jQuery.each（步骤、函数（i）{
if（jQuery（步骤[i]）.hasClass（'current'））{
jQuery（步骤[i]）.removeClass（'current'）；
jQuery（steps[i-1<0？steps.length-1:i-1]）.addClass（'current'）；
返回false；
}
})
});
})

.clearfix:after{
明确：两者皆有；
内容：“；
显示：块；
身高：0；
}
.集装箱{
字体系列：“Lato”，无衬线；
宽度：1000px；
保证金：0自动；
}
.包装纸{
显示：表格单元格；
高度：400px；
垂直对齐：中间对齐；
}
.导航{
边缘顶端：40px；
}
.向右拉{
浮动：对；
}
a、 a:主动的{
颜色：#333；
文字装饰：无；
}
a:悬停{
颜色：#999；
}
/*面包屑*/
.箭步.步{
字体大小：14px；
文本对齐：居中；
颜色：#666；
游标：默认值；
利润率：0.3倍；
填充：10px 10px 10px 30px；
最小宽度：180px；
浮动：左；
位置：相对位置；
背景色：#d9e3f7；
-webkit用户选择：无；
-moz用户选择：无；
-ms用户选择：无；
用户选择：无；
过渡：背景色0.2s；
}
.箭头步骤.步骤：之后，.箭头步骤.步骤：之前{
内容：“；
位置：绝对位置；
排名：0；
右：-17px；
宽度：0；
身高：0；
边框顶部：19px实心透明；
边框底部：17px实心透明；
左边框：17px实心#d9e3f7；
z指数：2；
过渡：边框颜色0.2s；
}
.箭头步骤。步骤：在{
右：自动；
左：0；
左边框：17px实心#fff；
z指数：0；
}
.箭头步骤.步骤：第一个孩子：之前{
边界：无；
}
.箭头步骤.步骤：第一个孩子{
边框左上半径：4px；
边框左下半径：4px；
}
.箭头步骤.步骤跨度{
位置：相对位置；
}
.箭头步骤。步骤跨度：之前{
不透明度：0；
内容：“✔";
位置：绝对位置；
顶部：-2px；
左：-20px；
}
.箭头步骤.步骤.完成跨度：之前{
不透明度：1；
-webkit转换：不透明度0.3s，轻松度0.5s；
-moz过渡：不透明度0.3s，减少0.5s；
-ms转换：不透明度0.3s降低0.5s；
过渡：不透明度0.3s，减少0.5s；
}
.箭头步数.步数.电流{
颜色：#fff；
背景色：#23468c；
}
.箭头步骤.步骤.当前：之后{
左边框：17px实心#23468c；
}

第一步
第二步：一些单词
步骤3
步骤4

需要更改当前步骤索引。在这种情况下，“完成”类也没有任何意义–请尝试：

jQuery（文档）.ready（函数（）{
var back=jQuery（“.prev”）；
var next=jQuery（“.next”）；
var steps=jQuery（“.step”）；
next.bind（“单击”，函数（）{
jQuery.each（步骤、函数（i）{
if（jQuery（步骤[i]）.hasClass（'current'））{
jQuery（步骤[i]）.removeClass（'current'）；
jQuery（steps[i+1>steps.length-1？0:i+1]）.addClass（'current'）；
返回false；
}
})
});
back.bind（“单击”，函数（）{
jQuery.each（步骤、函数（i）{
if（jQuery（步骤[i]）.hasClass（'current'））{
jQuery（步骤[i]）.removeClass（'current'）；
jQuery（steps[i-1<0？steps.length-1:i-1]）.addClass（'current'）；
返回false；
}
})
});
})

.clearfix:after{
明确：两者皆有；
内容：“；
显示：块；
身高：0；
}
.集装箱{
字体系列：“Lato”，无衬线；
宽度：1000px；
保证金：0自动；
}
.包装纸{
显示：表格单元格；
高度：400px；
垂直对齐：中间对齐；
}
.导航{
边缘顶端：40px；
}
.向右拉{
浮动：对；
}
a、 a:主动的{
颜色：#333；
文字装饰：无；
}
a:悬停{
颜色：#999；
}
/*面包屑*/
.箭步.步{
字体大小：14px；
文本对齐：居中；
颜色：#666；
游标：默认值；
利润率：0.3倍；
填充：10px 10px 10px 30px；
最小宽度：180px；
浮动：左；
位置：相对位置；
背景色：#d9e3f7；
-webkit用户选择：无；
-moz用户选择：无；
-ms用户选择：无；
用户选择：无；
过渡：背景色0.2s；
}
.箭头步骤.步骤：之后，.箭头步骤.步骤：之前{
内容：“；
位置：绝对位置；
排名：0；
右：-17px；
宽度：0；
身高：0；
边框顶部：19px实心透明；
边框底部：17px实心透明；
左边框：17px实心#d9e3f7；
z指数：2；
过渡：边框颜色0.2s；
}
.箭头步骤。步骤：在{
右：自动；
左：0；
左边框：17px实心#fff；
z指数：0；
}
.箭头步骤.步骤：第一个孩子：之前{
边界：无；
}
.箭头步骤.步骤：第一个孩子{
边框左上半径：4px；
边框左下半径：4px；
}
.箭头步骤.步骤跨度{
位置：相对位置；
}
.箭头步骤。步骤跨度：之前{
不透明度：0；
内容：“✔";
位置：绝对位置；
顶部：-2px；
左：