I need help selecting an HTML button that is generated within a for loop in a Django template using JavaScript. How can I assign a unique ID to each button and select it correctly in JavaScript? Currently, all buttons have the same ID within the loop, resulting in no action when clicked.
html
% for post in page_obj.object_list %}
<div class = "individual_posts">
<a href="{% url 'username' post.user %}"><h5 class = "post_user">{{ post.user }}</h5></a>
<h6 id = "post_itself">{{ post.post }}</h6>
{% if post.user == request.user %}
<button id="editButton" class="edit_button">Edit</button>
{% endif %}
</div>
{% endfor %}
JavaScript
document.addEventListener('DOMContentLoaded', function(){
document.querySelector('#uniqueIdHere').onclick = edit_email();
})