У меня есть два div, которые переключаются между dislpay: none и display: inline через одну и ту же функцию javascript. Это работает должным образом, однако я также хочу индексировать список outliers_data по некоторому целочисленному значению на основе того, что передается в функцию javascript. Я не уверен, как лучше всего выполнить эту задачу. Вот мой HTML:

{amp}lt;div id="outlier_list" style="display: inline"{amp}gt; {amp}lt;label style="text-decoration: underline; font-size: 24px;"{amp}gt;Outliers{amp}lt;/label{amp}gt;{amp}lt;br{amp}gt; {% for val, name in outliers %} {amp}lt;label onclick="swapOutlierContent({{ forloop.counter }})" style="font-weight: bold; cursor: pointer;"{amp}gt;{{ val }} {amp}lt;/label{amp}gt; {amp}lt;label style="font-style: italic;"{amp}gt;{{ name }}{amp}lt;/label{amp}gt;{amp}lt;br{amp}gt; {% endfor %} {amp}lt;/div{amp}gt; {amp}lt;div id="outlier_data" style="display: none;"{amp}gt; {amp}lt;label style="text-decoration: underline; font-size: 24px;"{amp}gt;Outlier In-Depth{amp}lt;/label{amp}gt;{amp}lt;br{amp}gt; {% for val, name in outliers_data %} {amp}lt;label onclick="swapOutlierContent({{ forloop.counter }})" style="font-weight: bold; cursor: pointer;"{amp}gt;{{ val }} {amp}lt;/label{amp}gt; {amp}lt;label style="font-style: italic;"{amp}gt;{{ name }}{amp}lt;/label{amp}gt;{amp}lt;br{amp}gt; {% endfor %} {amp}lt;/div{amp}gt; {amp}lt;script{amp}gt; function swapOutlierContent(outlier_id) { outlier_list = document.getElementById('outlier_list'); outlier_data = document.getElementById('outlier_data'); if (outlier_list.style.display == 'inline'){ outlier_list.style.display = 'none' } else { outlier_list.style.display = 'inline' } if (outlier_data.style.display == 'inline'){ outlier_data.style.display = 'none' } else { outlier_data.style.display = 'inline' } } {amp}lt;/script{amp}gt; 

Я хотел бы, чтобы {% for val, name in outliers_data %} стало что-то вроде {% for val, name in outliers_data.index %} но моя текущая структура кажется неправильной для этого.

Благодарность