Jquery каждый цикл с после ссылки

Question

Я хочу нарисовать линию холста от элемента.class к элементу класса. До сих пор я мог ссылаться на начальный и конечный элементы в классе с помощью elements.first() и elements.first().

Сложность в том, что я хочу использовать quadraticCurveTo, который хочет, чтобы начальная и конечная точка. Конечной точкой является следующий элемент в.class.

$('.myclass').chainlines();
$.fn.chainlines = function(){
context.moveTo($(this).first().position().left+15,$(this).first().position().top+20);
$(this).each(function(){
next = $(this).next();
context.quadraticCurveTo($(this).first().position().left+60,
$(this).position().top+25,$(next).position().left+15,$(next).position().top+15);
});
};

У меня есть пример jsfiddle, который мне нужно расширить в цепочку. см. ССЫЛКА.

Это не работает для меня.

Answer 1

Кажется, что скрипка не имеет ничего общего с вашим вопросом...

Я думаю, что вы ищете что-то вроде этого..

 divs.each(function(idx){
    alert(divs[idx].next().attr("id"));
 })

Answer 2

Может быть, это то, что вы ищете:

divs.each(function(){
   alert($(this).next().get(0).id);
})

Answer 3

Я решил свою проблему

$.fn.chainlines = function(){
    var divs = $(this);
    var count = $(this).length;
    for (var i = 0; i < count; i++) {
        if((i + 1) < count){
            context.moveTo($(divs[i]).position().left+15,$(divs[i]).position().top+20);
            context.quadraticCurveTo($(divs[i]).position().left+60,
                                 $(divs[i]).position().top+35,
                                 $(divs[i+1]).position().left+15,
                                 $(divs[i+1]).position().top+1);      
            context.stroke();
        }
    }
};