를 추가하는 방법은 클래스에서 매 div 를 사용하여 루프

이것은 나의 구조를 추가하려면 이상한도 등 모든면에서 두 div 그래서 내가 어떻게 이것을 달성할 수 구조 JavaScript 를 사용하여 루프 저는 모든 것을 시도했지만 나는 아무것도 나는 학습 JavaScript 루프 그래서 사람이 좀 도와 주시

var i = 0;
$('.CollectionInner__Products .Grid__Cell .ProductItem').each(function(i) {
  var index = 0;
  if (index % 3 == 0) {
    $(this).addClass("odd");
  }
});

<div class="custompsps">
  <div class="ProductItem">
  </div>
  <div class="ProductItem">
  </div>
  <div class="ProductItem">
  </div>
  <div class="ProductItem">
  </div>

</div>
<div class="custompsps">
  <div class="ProductItem">
  </div>
  <div class="ProductItem">
  </div>
  <div class="ProductItem">
  </div>
  <div class="ProductItem">
  </div>

</div>

내가 이것을 원하는 구조체:

i want this stucture
<div class="custompsps">
  <div class="ProductItem even">
  </div>
  <div class="ProductItem even">
  </div>
  <div class="ProductItem odd">
  </div>
  <div class="ProductItem odd">
  </div>

</div>
<div class="custompsps">
  <div class="ProductItem even">
  </div>
  <div class="ProductItem even">
  </div>
  <div class="ProductItem odd">
  </div>
  <div class="ProductItem odd">
  </div>

</div>