show td of a table according with the selected item in the combobox

[jean_5]

I have a table and i want that only appear the column that the user select in the combobox

<table class="form-list-table" width="100%">
                <tr class="form-list-table-header">
                    <td class="hidden" name="Nome">Municípios</td>
                    <td class="hidden" name="Nome">Postos de Identificação</td>
                    <td class="hidden" name="Nome">Colaboradores</td>
                    <td class="" name="Total">Inclusões</td>
            </tr>
</table>

<div class="form-item combobox esquerda">
                    <div class="form-item-label inline ui-widget-content"><span>Agrupar por</span></div>
                    <select class="combobox" name="AgruparPor">
                        <option value="Municipio">Municípios</option>
                        <option value="PostoIdentificacao">Postos de Identificação</option>
                        <option value="Usuario">Colaboradores</option>
                    </select>
                </div>

[pritaeas]

With jQuery this might do it:

$('select').on('change', function() {
    // get selected value
    var value = $(this).val();

    // hide all
    $('td[name="Nome"]').addClass('hidden');

    // unhide column where text matches selected value
    $('td[name="Nome"]').filter(function(){ return $(this).text() === value; }).removeClass('hidden');
});