JS/jQ - コンテナ間で水平方向に移動

Question

私は、可変長のより多くのDIV要素を含む一連のDIV要素を持っています。問題を単純化するサンプルコード...

<div class="container"> 
<div class="inset"></div> 
<div class="inset"></div> 
<div class="inset"></div> 
<div class="inset"></div> 
<div class="inset"></div> 
</div> 
<div class="container"> 
<div class="inset"></div> 
<div class="inset"></div> 
<div class="inset"></div> 
<div class="inset"></div> 
<div class="inset"></div> 
<div class="inset"></div> 
</div> 
<div class="container"> 
<div class="inset"></div> 
<div class="inset"></div> 
<div class="inset"></div> 
</div> 

として、私は「インセット」のDIV間を移動するには、jQueryのeach()を使用しています。しかし、私は、最初のコンテナの最初のインセットDIVと、2番目のコンテナの最初のインセットDIVと、3番目のコンテナの最初のインセットDIVと、最初のコンテナの2番目のインセットDIVの間を移動する必要があることを認識しました。 、など。

問題は、どのようにこれを行うかわかりません。

これらを移動する主な目的は、あらかじめ設定されたパターンで背景色を変更することです。私は、コードの構造をやり直すことは可能だとは思わない。

どうすればよいですか？

Answer 1

私のアプローチは最もエレガントではありませんが、それはできます。

ここで（Firebugの出力を見るためにインストールする必要があります）のサンプルです：http://jsfiddle.net/ceZkr/

var maxlength = 0; // first need to find container with the most insets. 
$('.container').each(function(index, val){ 
    var curlength = $(this).find('.inset').length; 
    if(curlength > maxlength) { 
     maxlength = curlength; 
    } 
}); 

console.log('our maxlength: ' + maxlength); 

for(var i = 0;i<maxlength; i++) { 
    $('.container').each(function(){ 
     var $box = $(this).find('.inset:eq('+i+')'); 
     if($box.length) { 
      console.log($box.text()); 
     } 

    }); 
}