Как использовать один js для разных id на странице?

Question

[lite_version]

Есть html форма в которой через цикл выводятся данные, как пример:

{% for el in form%}
     <div id="title{{ el.pk }}" >{{ el.titles }}</div>
     <div id="content{{ el.pk }} " style="display:none;">{{ el.text }}</div>
{% endfor %}

Js для показа и скрытия контента для одной формы написал:

$('#title').click(function () {
        if ($('#content').is(":hidden")) {
            $('#content').slideDown("slow");
        } else {
            $('#content').slideUp("slow");
        }
        return false;
    });

Но не понимаю, как передать pk в функцию, чтобы можно было использовать этот js при множественном выводе. Вроде как лучше прописать классы и их передавать каким-то образом в js, но при попытках какая-то нерабочая ерунда выходит.

Answer 1

[irishmann]

Answer 2

[Алексей]

Всем динамически создаваемым элементам прописать класс и вешать обработчик события на класс, а не на id.

$(document).on('click', '.title', function () {
      // использовать $(this) для выбора элемента, по которому кликнули
});