Как использовать Javascript eventListeners в проекте Django

Я довольно большой новичок во фреймворке Django и работаю над небольшим проектом, который требует от меня использования в нем статических файлов (JavaScript). У меня есть пара кнопок, которыми я хочу манипулировать из DOM, но по какой-то причине я не могу получить доступ к этим кнопкам, используя манипуляции DOM.

Может кто-нибудь подскажет, почему я не могу вывести эти кнопки в консоль? То, что я получаю на выходе - это пустая HTMLcollection[]

const deleteButton = document.getElementsByClassName('delete-button');
console.log(deleteButton);

** Шаблон **

<div class="my-2">
            {% for todo in mytodos %}
            <div class="checkbox my-2">
                <div class="checkbox-wrapper">
                    <input type="checkbox" id="cbox3" class="mr-2" value="third_checkbox">
                    <label for="cbox3"> {{ todo.todotext }} </label>
                </div>
                <div>
                    <a href= {% url 'delete' %}>
                        <button class="delete-button btn btn-outline-danger">Delete</button>
                    </a>
                </div>
            </div>
            
            {% endfor %}
            
        </div>

Вернуться на верх