获取td中的下一个元素

Question

<table>
    <tr>
        <td><span data-....></span></td> // 1
        <td><a href="">....</a><td>
        <td><span data-....></span></td> // 2
        <td><a href="">....</a><td>
        <td><span data-....></span></td> // 3
        <td><a href="">....</a><td>
    </tr>
</table>

当我点击跨度时，我如何找到下一个跨度？

跨度转换为输入，当我按下TAB按钮时，我想转到下一个跨度...

在每个跨度之间都有一个href ..没有a hrefs它可以工作

$('table td span').hover(function () {
    $(this).css('cursor','pointer');
});

$(document).on('keydown', 'table td input', function(event) {
    var target = $(this);

    if (event.which == 9) {
        event.preventDefault();

        console.log('Tab pressed');

        var span = target.parent().next().find('span');

        span.click();

        console.log(span.data('date'));
    }
});

Answer 1

$('table td').on('click', 'span', function(event) {
    $(this).parent()         // the parent of the span
           .next()           // the next element to that parent (href td)
           .next()           // the next element to that next element (span td)
           .find('span');    // the span children of the first
});