howto breadcrumbs / progress meter bar

Question

我的目标是拥有一种与此类似的面包屑

这是一个可点击的进度表...

这里有一个开头：http://jsfiddle.net/3z7Lsbdd/3/

每个li a都有一个data-index。

我想要的是，当我点击链接时，li的所有data-index <= clicked index都会变为红色（添加课程survey selected）

$(".surveybreadcrumbs li a").click(function () {
         ????   
        }
        )

欢迎任何帮助。

Answer 1

应该是这样的：

$(".surveybreadcrumbs li a").click(function () {
     var clickindex = $(this).data('index');
     $(".surveybreadcrumbs li a").each(function (i, val) {
            if  ( $(this).data('index') <= clickindex )
                $(this).addClass("surveyselected");
            else
                $(this).removeClass("surveyselected");
     });
});

更新小提琴：http://jsfiddle.net/3z7Lsbdd/4/