Ищем лучшее/элегантное решение для appendTo DIVs с jquery в списках

Question

Я преподаю себе JS и JQuery в первую очередь для GM-скриптов (им не программистом в день) и попытался придумать решение добавить DIV к другому DIV для каждого отдельного листинга на autotrader.com. Они являются братьями и сестрами под несколькими родителями. Полный код находится здесь http://userscripts.org/scripts/review/83865 и работает.

Я пришел с этим:

var counter=0; 
$('.dealer-info').each(function(){ 
$(this).appendTo($('.car-info')[counter]); 
counter=counter+1; 
}); 

Есть ли более элегантный способ сделать это?

Любой совет будет оценен, так как я хочу, чтобы мой код был проще.

С уважением, Антони

Answer 1

.each() обеспечивает индекс в качестве первой переменной в функции обратного вызова, так что вы можете сделать это:

$('.dealer-info').each(function(i) { 
    $('.car-info').eq(i).append(this); 
}); 

С .appendTo() просто получает переворачивается вокруг .append() внутренне это менее расточительным и немного легче глаза, чтобы сделать это таким образом, используя .eq(), чтобы получить элемент по этому индексу.

Чтобы быть более производительным, вы должны держать ссылку на .car-info вне цикла, как это:

var cars = $('.car-info'); 
$('.dealer-info').each(function(i) { 
    cars.eq(i).append(this); 
}); 

Answer 2

Так что вы хотите добавить каждый элемент с классом «дилер-инфо» к каждому элементу с классом «автомобиль-инфо»?

$(".dealer-info").appendTo($(".car-info")); не так ли?

Answer 3

Вдоль линий вашего кода, но немного больше jQuery. Не пробовал, но должен хорошо работать.

$('.dealer-info').each(function(index, value){ 
    $(this).appendTo($('.car-info').eq(index)); 
});