Как поставить класс css по умолчению?

Есть две кнопки - Таблица и Список. Нажимаю на Таблица - объекты выводятся таблицей. Нажимаю на Список - выводятся списком.

Все это дело запоминается с помощью cookies.
Проблема в том, что когда cookies пусты, то объекты отображаются в виде таблицы (это правильно), но по умолчанию активная кнопка Список
Получается мне нужно сделать один лишний клик. т.е. нажать на Таблица, она станет активной, но ничего не изменится т.к. объекты отображаются уже таблицей. И только потом на Список

Нужно чтобы объекты отображались таблицей и кнопка Таблица тоже была активной (класс .active)

erb:

<ul class="nav">
  <li class="<%= 'active' if cookies['filter-product'] != 'buble' %>">
    <a class="nav-list" href="">item</a>
  </li>
  <li class="<%= 'active' if cookies['filter-product'] == 'buble' %>">
    <a class="nav-cols" href="">table</a>
  </li>
</ul>
<!-- container with items -->
<div class="infinite-table">
  <ul class="ctf--b-product-list <%= 'product-list-buble' unless cookies['filter-product'] == 'buble' %>">
    <li>item</li>
    <li>item</li>
    <li>item</li>
    <li>item</li>
    <li>item</li>
  </ul>
</div>

js:

$(document).ready(function(event){
    $('.nav a').click(function() {
    if (!($(this).parent().hasClass('active')))
    {
        $('.nav li').removeClass('active');
        $(this).parent().addClass('active');
        if ($(this).hasClass('nav-cols'))
        {
          $.cookie('filter-product', 'buble');
          $('.ctf--b-product-list').addClass('product-list-buble');
        }
        else{
          $('.ctf--b-product-list').removeClass('product-list-buble');
          $.cookie('filter-product', 'non-buble');
        }
        return false;
    }
    else {
        return false;
    }
  });
});

css: (использую спрайты для кнопок Таблица и Список)

.nav { list-style:none; vertical-align:top; right:0; top:-50px; position:absolute; }
.nav li { float: left; padding:0 0 0 10px; }
.nav a { width:18px; height:18px; font-size:2em; line-height:0; display:block; }
.nav .active .nav-list { background-position:0 bottom; }
.nav .nav-cols { background-position:right 0; }
.nav .active .nav-cols { background-position:right bottom; }

или подскажите плагины для этих целей. Заранее спасибо.