Alternate color every two columns CSS/Javascript in a HTML table

Question

I have a table that has dynamic columns added to it by Javascript. I am looking for a way to alternate the background color of every two columns, such as:

<table>
  <tr>
    <td>FIRST BGCOLOR</td>
    <td>FIRST BGCOLOR</td>
    <td>SECOND BGCOLOR</td>
    <td>SECOND BGCOLOR</td>
    <td>FIRST BGCOLOR</td>
    <td>FIRST BGCOLOR</td>
    <td>SECOND BGCOLOR</td>
    <td>SECOND BGCOLOR</td>
  </tr>
</table>

So I know how to do alternate coloring with CSS (:nth-child(odd) etc..), but not how to have TWO columns the same color, then different color for the next two, and so on...

How can this be acheived? Javascript or jQuery solutions are also welcomed as I am using those already in the project, but CSS would be preferrable of course.

Thank you all!

Answer 1

td
{
    background: #0f0;
}
td:nth-child(4n+3),
td:nth-child(4n+4)
{
    background: #f00;
}

Answer 2

td{
  background: grey;
  }

td:nth-of-type(4n), td:nth-of-type(4n - 1){
  background: lime;
  }

<table>
  <tr>
    <td>FIRST BGCOLOR</td>
    <td>FIRST BGCOLOR</td>
    <td>SECOND BGCOLOR</td>
    <td>SECOND BGCOLOR</td>
    <td>FIRST BGCOLOR</td>
    <td>FIRST BGCOLOR</td>
    <td>SECOND BGCOLOR</td>
    <td>SECOND BGCOLOR</td>
  </tr>
</table>