Javascript Jquery单击事件在最后一个子项中未激发？

这是我的html代码

<table id='code'>
    <tr>
        <td>data1</td>
        <td>data2</td>
        <td>data3</td>
        <td class='action'>data4</td>
    </tr>
    <tr>
        <td>data1</td>
        <td>data2</td>
        <td>data3</td>
        <td class='action'>data4</td>
    </tr>
    <tr>
        <td>data1</td>
        <td>data2</td>
        <td>data3</td>
        <td class='action'>data4</td>
    </tr>

这是我的jquery代码，正在运行。在所有td标签上都会发生此fire click事件

但是我只想单击事件激发前三个

td

而不是

td中的。action

表示最后一个

td
，您可以使用或忽略与选择器匹配的一组元素

$('#code tr td:not(.action)').on('click',function(){
    alert($(this).html());
});

演示：

或

演示：

$('#code tr td:not(.action)').on('click',function(){
    alert($(this).html());
});

$('#code tr td').not('.action').on('click',function(){
    alert($(this).html());
});

$('#code tr').on("click","td:not('.action')",function(){
alert($(this).html());
});