Как обратиться к соседнему объекту DOM, если объект и его сосед — в разных?

Question

[Иван]

Здравствуйте.
Есть таблица с помещенным в каждую ячейку объектом .
Например:

<table>
   <tr>
      <td><input type='buton' onclick=changeType(this)></td>
      <td><input type='buton'></td>
   </tr>
   <tr>
   ...
   </tr>
</table>

Как в функции changeType () обратиться к соседнему элементу (следующему input), чтобы изменить type на 'text'?
element.nextElementSibling выдает NULL

Answer 1

[0xD34F]

document.querySelector('table').addEventListener('click', ({ target: t }) => {
  const next = t.matches('input[type="button"]') && t.parentNode.nextElementSibling;
  const input = next && next.querySelector('input');
  if (input) {
    input.type = 'text';
  }
});

Comments

[Владимир]

Добавлю
Чтобы не править постоянно выборку parentNode.nextElementSibling лучше завязаться на классы и использовать closest и querySelector
https://jsfiddle.net/vL42j7pr/1/