Неправильная практика хранения информации в id элемента HTML?

Question

Предположим, у меня есть шаблон, и я хочу создать цикл и создать div. Я хочу, чтобы слушать щелчки на кнопках, содержащихся в каждом из этой дивы:

<div class="repeatedDiv"> 
    <button class="reply-button"> 
</div> 

$('.reply-button').on('click',function(e)...) 

Я хочу, чтобы функция кнопки ответа специфична для DIV, что он был выбран на. Было бы плохо, чтобы иметь что-то вроде:

<div class="repeatedDiv"> 
    <button class="reply-button" id="reply-{{this.id}}"> 
</div> 

Answer 1

Не сделать его более сложным, чем это на самом деле

$(document).on('click', '.reply-button', function(e){ 
 
    var divClicked = $(e.target).closest('.repeatedDiv'); 
 
    // do something with clicked div 
 
    // var divClicked is the div elmt that contains the button that was clicked 
 
    // doing it this way you might not even need an id at all 
 
    console.log(divClicked.attr('id')); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="div1" class="repeatedDiv"> 
 
    <button class="reply-button">div1</button> 
 
</div> 
 
<div id="div2" class="repeatedDiv"> 
 
    <button class="reply-button">div2</button> 
 
</div> 
 
<div id="div3" class="repeatedDiv"> 
 
    <button class="reply-button">div3</button> 
 
</div>

И если вам нужно идентификатор при создании новый div создает его динамически, например

var newID = "id-" + Date.now(); 
 
console.log(newID);