通过Jquery添加类它只对第一个元素有效[待定]

classList.toggle 改变颜色。大部分情况下一切都很好,但导航只在第一时间起作用 li a . 这是我的代码:

HTML格式

<div class="fixed-darkmode">
    <div class="darkmode-definition">
        <button class="nightModeButton">darkmode</button>
    </div>


    <nav style="padding-left: 100px;">
        <ul>
            <li><a href="#">Bio</a></li>
            <li><a href="#">GalÃ©ria</a></li>
        </ul>
    </nav>

CSS

li a {
    display: inline-block;
    font-family: 'Merriweather', serif;
    font-weight: 500;
    font-size: 22px;
    text-decoration: none;
    color: #171717;
    padding: 0 30px;
}

li a:hover {
    color: #171717;
    text-decoration: none;
}

body.night-mode {
    background: #181b23;
}

li a.night-mode {
    color: #fff !important;
}

Javascript(jQuery)

var nightModeToggleButton = document.querySelector(".nightModeButton");
var body = document.querySelector("body");
var navigacka = document.querySelector("a");

nightModeToggleButton.onclick = function() {
    nightModeToggleButton.classList.toggle("night-mode");
    body.classList.toggle("night-mode");
    navigacka.classList.toggle("night-mode");
};