Не работает фильтр на js?

Question

[Alibek Kulseitov]

В общем стоит задача сделать фильтр на js.
Нашел такое Ссылка

Сделал по примеру но поменял пару значении так как фильтр должен искать в двух разных списках.
Но JS выдает ошибку. Не могу понять почему он жалуется.

Вот код Jsfiddle

Answer 1

[Максим Петелин]

Надо так

ul = document.getElementsByClassName('play-team__list')[0];

а не

ul = document.getElementsByClassName('play-team__list');

getElementsByClassName возвращает массив
а на w3schools возвращался один элемент
ul = document.getElementById("myUL");

Comments

[Alibek Kulseitov]

Сделал так как вы сказали, он ищет только в первом списке =)

[Максим Петелин]

Нужно полностью написать рабочий пример или просто указать на ошибку?
Второй список это
var ul2 = document.getElementsByClassName('play-team__list')[1];
val li2 = ul2.getElementsByTagName('li');
и.т.д.

[Alibek Kulseitov]

Максим Петелин: на jsfiddle и есть полный пример =) Там два списка. Две колонки, а он ищет только в первой

[Максим Петелин]

https://jsfiddle.net/w9j58ybg/

[Alibek Kulseitov]

Максим Петелин: Спасибо, вижу вы просто создали новые переменные. А это точно единственное решение в данном случае)? Просто не люблю лишний код =))

[Максим Петелин]

Единственное решение для чего? Реализации фильтра? Несомненно нет.
Вопрос был в том что вы не могли понять на что жалуется браузер.

[Stalker_RED]

Максим Петелин: А если списков будет 10 штук, то и код нужно 10 раз скопировать, да?

[Максим Петелин]

Stalker_RED: Если сильно менять код, вводить цикл и.т.д. задающий вопрос человек, больше времени потратит на понимание того что ему действительно интересно, как мне думается

Answer 2

[Stalker_RED]

Метод getElementsByClassName возвращает HTMLCollection, а у него нет метода getElementsByTagName.

Можно переделать так: https://jsfiddle.net/4L7z6cq4/
Еще лучше, вешать обработчик при помощи addEventListener, а не инлайн onkeyup.

Comments

[Alibek Kulseitov]

Первый ответ помог! Но ваш вариант по лучше кажется =) компактный код