jQuery - Цикл через переменную/элементы?

Question

Я пытаюсь загрузить определенные продукты в div, но каждый div загружается только в первый продукт. Я предполагаю, что мне нужно сделать петлю из какой-то, но я не совсем уверен, как

Вот что я пытаюсь сделать:

<div class="prdContainer" rel="prod-1"></div> 
<div class="prdContainer" rel="prod-2"></div> 
<div class="prdContainer" rel="prod-3"></div> 

$(document).ready(function() { 
    var prdNo = $('.prdContainer').attr('rel').split('-')[1]; 

    $('.prdContainer').load('http://www.domain.com .product:nth-child(' + prdNo + ')'); 
}); 

На мой взгляд, это то, что он должен делать:

$('.prdContainer').load('http://www.domain.com .product:nth-child(1)'); 
$('.prdContainer').load('http://www.domain.com .product:nth-child(2)'); 
$('.prdContainer').load('http://www.domain.com .product:nth-child(3)'); 

что бы быть связано с:

rel="prod-1" 
rel="prod-2" 
rel="prod-3" 

Любая помощь была бы замечательной!

Answer 1

$(document).ready(function() { 
    $('.prdContainer').each(function(i){ 
    $(this).load('http://www.domain.com .product:nth-child(' + (i + 1)+ ')'); 
    }); 
}); 

вы должны знать, что индекс начинается с 0

Answer 2

Используйте атрибут равен селектор (официальный docs):

$('.prdContainer[rel="prod-' + prdNo + '"]').load(...);