行跨度(jQuery)的单元格选择不正确

我刚刚做了一个测试页面,你发布的代码运行得很好。但是,该表至少需要5列宽和4行高,否则我认为代码无法正常工作。下面的示例显示jquery代码正在工作。

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
    $("table tr td:first").addClass("first-col-cell");
    $("table tr td:last-child").addClass("last-col-cell");
});
</script>
<style>
    .first-col-cell {
        background-color: red;
    }

    .last-col-cell {
        background-color: blue;
    }
</style>
<table>
<tr>
  <td colspan="3" rowspan="4">1</td>
  <td>2</td>
  <td>3</td>
</tr>
<tr>
    <td>some</td>
    <td>content</td>
    <td>for</td>
    <td>teh</td>
    <td>test</td>
    <td>blahh</td>
</tr>
<tr>
    <td>some</td>
    <td>content</td>
    <td>for</td>
    <td>teh</td>
    <td>test</td>
    <td>blahh</td>
</tr>
<tr>
    <td>some</td>
    <td>content</td>
    <td>for</td>
    <td>teh</td>
    <td>test</td>
    <td>blahh</td>
</tr>
<tr>
    <td>some</td>
    <td>content</td>
    <td>for</td>
    <td>teh</td>
    <td>test</td>
    <td>blahh</td>
</tr>
<tr>
    <td>some</td>
    <td>content</td>
    <td>for</td>
    <td>teh</td>
    <td>test</td>
    <td>blahh</td>
</tr>
</table>