Navegação em tabela de classificação

Pessoal, bom dia.

Preciso de mais uma ajuda no desenvolvimento da tabela. Estamos usando como referência o site G1.

/applications/core/interface/imageproxy/imageproxy.php?img=https://lh6.googleusercontent.com/-gqrbNQlQaKk/UYkNyKQVw9I/AAAAAAAAAI0/Qec3rNxNeik/w311-h281-no/navegacao-tabela.jpg&key=7a8ecd01b45698308ee2df493ea11b2e71fff0ce011c3e1e2304b2c082a6afe8" alt="navegacao-tabela.jpg" />
http://globoesporte.globo.com/futebol/copa-das-confederacoes/index.html

Na navegação entre os grupos (área destacada no print) existe a troca das colunas que contém as informações de cada grupo. A coluna exibida por padrão é essa:

<tbody>
<tr class="time-home">
<td class="cor-tabela">1</td>
<td class="time">Brasil</td>
<td class="coluna-p">0</td>
<td class="coluna-j">0</td>
<td class="coluna-v">0</td>
</tr>
<tr class="time-home">
<td class="cor-tabela">1</td>
<td class="time">Itália</td>
<td class="coluna-p">0</td>
<td class="coluna-j">0</td>
<td class="coluna-v">0</td>
</tr>
<tr class="time-home">
<td class="cor-tabela">1</td>
<td class="time">Japão</td>
<td class="coluna-p">0</td>
<td class="coluna-j">0</td>
<td class="coluna-v">0</td>
</tr>
<tr class="time-home">
<td class="cor-tabela">1</td>
<td class="time">México</td>
<td class="coluna-p">0</td>
<td class="coluna-j">0</td>
<td class="coluna-v">0</td>
</tr>
</tbody>

Ao clicar na seta "next" são apresentadas as linhas e as células do grupo B:

<tbody>
<tr class="time-home">
<td class="cor-tabela">1</td>
<td class="time">Espanha</td>
<td class="coluna-p">0</td>
<td class="coluna-j">0</td>
<td class="coluna-v">0</td>
</tr>
<tr class="time-home">
<td class="cor-tabela">1</td>
<td class="time">Nigéria</td>
<td class="coluna-p">0</td>
<td class="coluna-j">0</td>
<td class="coluna-v">0</td>
</tr>
<tr class="time-home">
<td class="cor-tabela">1</td>
<td class="time">Taiti</td>
<td class="coluna-p">0</td>
<td class="coluna-j">0</td>
<td class="coluna-v">0</td>
</tr>
<tr class="time-home">
<td class="cor-tabela">1</td>
<td class="time">Uruguai</td>
<td class="coluna-p">0</td>
<td class="coluna-j">0</td>
<td class="coluna-v">0</td>
</tr>
</tbody>

Porém, se analisarem com o Firebug, as TR's do grupo B sequer aparecem no HTML. Como faço para desenvolver essa navegação? É com JavaScript?

Agradeço mais uma vez qualquer ajuda! :yes: