Почему не работает js код?

Question

[nichvlas]

Никак не могу понять почему не работает этот код
Смысл в том, чтобы открывать меню через клик на кнопку, после клика определенному пункту меню добавлять класс (чтобы меню отобразилось).
В консоли ошибки нет, но код не работает

document.body.onload = function() 
    {
        setTimeout(function()
                   {
    var clickMeLink = document.querySelector('.clickmelink');
    var addClassMenu = document.querySelector('.test-class');
            
    clickMeLink.addEventListener ('click', function () {
    addClassMenu.classList.add('hover');
    });
        }, 1000); }

https://jsfiddle.net/uhc8b0sp/3/

Comments

[ProjectSoft]

Если хотите выполнить скрипт после загрузки всего контента лучше использовать DOMContentLoaded

Answer 1

[MagicMight]

1) Если через консоль разработчика открыть, то видно, что тег не рендерится вне таблицы
2) Обработчик вешается на класс clickmebitch, а реальный класс ссылки - clickmelink

UPD см. первый пункт. все работает
https://codepen.io/MagicMight/pen/NWqKJvw?editors=1010

Comments

[nichvlas]

Я хотел сделать код приличнее, и не везде его отредактировал
Но класс и до этого не добавлялся при клике

[nichvlas]

Можете мне, дураку, объяснить почему это не работает тут? (кпопка кликни на меня в хедере)
dipl0m-best.nl

[MagicMight]

nichvlas, оно работает раз через пять.
Дело в том, что на изменение списка классов влияет еще другой обработчик событий, который срабатывает при реальном наведении.
В том месте, где описан класс .hover попробуй добавить класс с другим названием, но повторяющий его же свойства

[nichvlas]

Спасибо
Я сейчас разобрался, мою кнопку перекрывал другой элемент и из-за этого рабочий код не работал по итогу
Сейчас когда убрал новость в хедере все работает

Answer 2

[FeST1VaL]

1. Зачем вам таймаут и вешать при onload?
2. Классы не правильные.
3. Все работает если оставить 5 строчек и убрать td (тк нету таблицы)