Estoy tratando de llamar a una función cuando se hace clic en un botón HTML, pero en este momento, se supone que se ejecuta un console.log cuando se hace clic en el botón, pero no aparece nada en la consola. Este botón está dentro de un bucle for en Django y se selecciona a través querySelector a través de su clase. Solo quiero que se seleccione el botón específico en el que se hace clic, pero no sé si se está seleccionando algo porque no sucede nada cuando se hace clic en el botón.
javascript
document.addEventListener('DOMContentLoaded', function(){ document.querySelector('.edit_button').addEventListener('click', () => console.log("test")); });html
{% for post in page_obj.object_list %} <div class = "individual_posts"> <h6 id = "post_itself">{{ post.post }}</h6> {% if post.user == request.user %} <button id="editButton" class="edit_button">Edit</button> {% endif %} </div> {% endfor %}querySelector solo devuelve el primer elemento que coincide con la consulta. Utilice querySelectorAll para obtener todos los elementos que coincidan. Repita el resultado y agregue los detectores de eventos por botón.
document.addEventListener('DOMContentLoaded', function(){ const buttons = document.querySelectorAll('.edit_button'); for (const button of buttons) { button.addEventListener('click', () => console.log("test")); } });