.slice и .wrapall

Question

Я использую немного кода, предложенного участником в stackoverflow и адаптированный мной, чтобы обернуть каждые 3 элемента списка как часть мега-меню. Код:

var lis = $("ul > li"); 
for(var i = 0; i < ls.length; i+=3) { 
    lis.slice(i, i+3).wrapAll("<div class='new'></div>"); 
} 

К сожалению, это будет захватывать ребенок Ли из следующего меню родительского завалить «квоту» на 3 Ли в делах. Это, конечно же, массовое испортить мои меню. Для примера, пожалуйста, посетите здесь.

Есть ли у кого-нибудь предложения, как я мог это исправить?

Answer 1

Ваша проблема ваш селектор , Так как sizzle работает справа налево, он просто запросит все LI elements, у которых есть UL element как прямой родительский (обычно это всегда так).

Итак, отделите свой ULs.

$('ul').each(function(){ 
    var $lis = $(this).children('li'); 
    for(var i = 0, len = $lis.length; i < len; i+=3){   
    $lis.slice(i, i+3).wrapAll("<div class='new'></div>"); 
    } 
}); 

Answer 2

Вы пробовали применить его к использованию класса как селектор ht?

var lis = $("ul.list-content > li"); 
for(var i = 0; i < lis.length; i+=3) { 
    lis.slice(i, i+3).wrapAll("<div class='new'></div>"); 
} 

Но если вы не знаете, я предупреждаю вас, что вы нарушаете РОМ .. вы ставите DIV на ул что не есть хорошо ..;)