Как обратиться к элементу в ячейке таблицы ( Jquery)?

Question

[Romario122]

Здравствуйте. Подскажите новичку как обратиться к элементу в таблице ...

<div class="container"><br>
    <table class="table" id="table">
        <tbody class="body">
        <tr>
        <td><span>Клик</span></td> // как показать алерт по клику на этот span ?
        </tr>
        <tr>
        <td><span>Клик</span></td> // как показать алерт по клику на этот span ?
        </tr>
        <tr>
        <td><span>Клик</span></td> // как показать алерт по клику на этот span ?
        </tr>
       </tbody>
    </table>
</div>

Это не работает

$("#table tr td span").click(function() {
        alert($(this).text());
    });

Comments

[Everybody_Lies]

У вас jquery на странице подключен?

[Romario122]

Everybody_Lies, да подключен, при обращениии к таблице все работает а со вложенными элементами нет

[Everybody_Lies]

Romario122, ну я вам выше скинул песочницу, в выложенном вами коде всё работает - алерт по клику на конкретный спан

Answer 1

[Stalker_RED]

table.addEventListener('click', function(evt) {
    const cell = evt.target.closest('span');
    if (cell && cell.matches('tr td span')) {
        alert(cell.textContent);
    } 
});

$('table').on('click', 'tr td span', function() {
  alert(this.textContent);
});

Писал с телефона, возможны опечатки.

Comments

[Everybody_Lies]

одна скобка после if в 3 строке потерялась

[Romario122]

Второй способ работает для меня, большое спасибо за помощь.

[Stalker_RED]

Romario122, они одинаковые по сути.
В способе с jq на одну строку меньше, но подключается этот древний комбайн, который в современности почти никогда не нужен.

Answer 2

[Владимир Ясанкин]

onclick на div или table в нем код:
ev = event || window.event
var t = ev.target || ev.srcElement
alert(t.innerHTML)