Simple jQuery problem

Question

This one should be easy

I've got this HTML

<table class="PageNumbers">
<tr>
    <td colspan="3">text3
    </td>
</tr>
<tr>
    <td colspan="2">text
    </td>
    <td>text2
    </td>
</tr>
<tr>
    <td>moretext
    </td>
    <td>moretext2
    </td>
<td>moretext3
    </td>
</tr>
</table>

I need to change the colspan of the first rows first column to one

This is what i've got

$('.PageNumbers tr:first td:first').attr('colspan') = '1'

Doesn't seem to work though

Any ideas?

Thanks

Answer 1

You're really close I think. Try this.

$('.PageNumbers tr:first td:first').attr('colspan', '1');

Also, I think by specs class names are supposed to be lowercase? It shouldn't stop anything from working though.

Answer 2

Try this:

$('.PageNumbers tr:first td:first').attr('colspan', '1');

Answer 3

Here's another way:

$('.PageNumbers')[0].rows[0].cells[0].colSpan = 1;

or:

$('.PageNumbers')[0].rows[0].cells[0].setAttribute('colSpan', 1);

Answer 4

You can use this selector:

$('table.PageNumbers > tr:first > td:first').attr('colspan', '1');

Check out the jQuery selectors for more information :)

Answer 5

You should do this:

$('table.PageNumbers').find('tr:first td:first').attr('colspan', '1');

Answer 6

This should be the fastest.

$('.PageNumbers tr td').eq(0).attr('colspan',1);