Jquery - How to alternate an :Odd :Even pattern every 4 ?

Question

I\'m trying to make a pattern in a layout (see attachment for visualisation) The problem is that using :odd :even doesnt work.

I\'ve tried to make it work by using \

Answer 1

This can be done in 2 lines of jquery.

Here's the HTML format that I used for this:

CSS:

#container {
        width: 816px;
        margin: 0 auto;
    }
    #container .row div {
        width: 100px;
        height: 100px;
        float: left;
        background: #fff;
        border: 1px solid black;
    }
    .dark {
        background: #000 !important;
    }

jquery:

$(document).ready(function() {
        $("#container .row:nth-child(even) div:nth-child(even)").addClass("dark");
        $("#container .row:nth-child(odd) div:nth-child(odd)").addClass("dark");
});

This tells it to set a class of dark for every even div on every even row and set that class on the odd divs in the odd rows.