Как вывести конкретное содержимое, связанное с заголовком

Я пытаюсь сделать сайт, который показывает решения по различным делам на основе некоторых условий. Я выталкиваю данные из базы данных, куда загружаю название судебного решения и его содержание. В html-файле я написал следующее:

 {% for data in law_data %}
    {% if data.law_type == 'civil' and data.law_category == 'limitations' %}
        <div class="tab">
            <button class="tablinks" onclick="openLawtype(event,'title')">{{data.title}} &nbsp<i class="fas fa-chevron-circle-right"></i></button>  
        </div>
     
    {% endif %}
{% endfor %}

Здесь, после проверки условий, заголовки печатаются в виде кнопок. Названия выводятся из базы данных. я хочу, чтобы отдельные названия показывали связанные с ними суждения. для этого я написал следующий код:

 {% for data in law_data %}
    {% if data.title in data.judgments %}
        {{data.judgments|safe}}
    {% else %}
        <p> no data available</p>    
    {% endif %}
 {% endfor %}

Однако независимо от того, какую кнопку я нажимаю, печатаются все решения, которые есть в базе данных. Я не могу разработать логику, как напечатать решение, которое содержит заголовок как часть его и напечатать только решение, которое связано с заголовком.

Будет очень полезно, если вы поможете разработать логику, так как я новичок. Также, пожалуйста, скажите мне, используется ли другая логика для создания такого рода сайтов.

Я пытаюсь сделать это с помощью операторов if на одной странице. Если это не правильный способ создания такого рода веб-сайта, пожалуйста, предложите мне, как я могу решить эту задачу или какую именно логику используют такие веб-сайты.

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