How to select 1st, 4th, 7th element and so on?

To style the first, fourth, seventh (and so on) elements, the easiest method is, with CSS, to use the following (I'm assuming you're working with li elements, but obviously adapt to your use-case):

ul {
    counter-reset: lis;
}

li::after {
    counter-increment: lis;
    content: counter(lis, decimal);
}

li:nth-child(3n+1) {
    background-color: #f90;
}

JS Fiddle demo.

References:

  • CSS selectors.
  • :nth-child().

I think, this is easier than the accepted answer:

li:nth-child(3n - 2) {
    padding-left: 0; // etc
}