Подсчёт количество блоков и присваивание классов

Задача следующая: на сайте есть несколько контейнеров, в которых разное количество блоков и в зависимости от этого количества, необходимо проставить каждому блоку определенный класс. Поясню на примере.

Допустим у вас следующая разметка:

<div class="container">
	<div class="unit">Первый блок первого контейнера</div>
	<div class="unit">Второй блок первого контейнера</div>
</div>

<div class="container">
	<div class="unit">Первый блок второго контейнера</div>
	<div class="unit">Второй блок второго контейнера</div>
	<div class="unit">Третий блок второго контейнера</div>
</div>

<div class="unit">Первый блок первого контейнера</div>

<div class="unit">Второй блок первого контейнера</div>

</div>

<div class="unit">Первый блок второго контейнера</div>

<div class="unit">Второй блок второго контейнера</div>

<div class="unit">Третий блок второго контейнера</div>

</div>

Как видно, в одинаковых контейнерах находится разное количество блоков: в первом — два, во втором — три. Если эти блоки добавились статически, например, в landing page, и добавляться в дальнейшем вряд ли что-то будет, то смысла в дальнейшем нет. Но если эти блоки добавляются динамически, например, добавляются новые товары с помощью CMS (в моем случае Drupal), тогда следующее решение может помочь в динамическом формировании макета.

Итак, задача такова: если количество блоков в контейнере кратно трем (3, 6, 9 и т.д.), то блоку нужно добавить класс «one-third» (в свое время данному классу задан стиль «width: 33.33333%»), и вывод будет примерно следующим:

one-third

Если же количество блоков, как в первом контейнере, не кратно трем, то блоку добавляем класс «one-second» (а данному классу пусть будет задан стиль «width: 50%»). В таком случае вывод будет таковым:

one-second

Конечно, классу «unit», по мимо всего прочего, нужно еще добавить свойство «float: left», чтобы получилось показанное выше, но это уже дело техники и знаний CSS. Мы же затеяли эту тему для написания скрипта, для динамического присваивания описанных классов. Для этого, в вашем файле js нужно добавить следующий код:

$(document).ready(function(){
  $('.container').each(function() {
    var $units = $(this).find('.unit');
    $units.addClass($units.length % 3 == 0 ? 'one-third' : 'one-second');
  });
});

$(document).ready(function(){

$('.container').each(function() {

var $units = $(this).find('.unit');

$units.addClass($units.length % 3 == 0 ? 'one-third' : 'one-second');

});

На этом, все.

Подсчёт количества блоков в контейнере и присваивание классов