JQuery的class选择器遍历赋值的小技巧

在做项目中，遇到这样一个需求。

下边是一个轮播图，里边的块需要ajax从后端获取，然后动态地加载上去。

很明显，里边的元素只能通过class来获取。

我这里后台给返回了4条记录，但是通过$(".class")获取以后，会有9个class对象，直接each遍历并赋值的话，会报“Cannot read property 'lessonImage' of undefined”错误

$(".lessonimgurl").each(function (i, n) {
    $(this).attr("src", data[i].lessonImage)
})

经过一番挣扎后，我放弃了从Js技术上的解决方法，采用了一个小技巧，就是对class对象取余，保证遍历元素不超出ajax返回的data的长度，这样就完美地解决了这个问题。

<script type="text/javascript">
        $(document).ready(function () {
            $.ajax({
                url: "http://localhost:8080/lesson/getall",
                type: "GET",
                dataType: "json",
                success: function (data) {
                    lessonlength = data.length;

                    $(".lessonimgurl").each(function (i, n) {
                        i = i % lessonlength;
                        $(this).attr("src", data[i].lessonImage)
                    })
					$(".studyurl1").each(function (i, n) {
                        i = i % lessonlength;
                        $(this).html(data[i].lessonName)
                    })
                }
            })
        })
    </script>