title: Django for loop list with jquery and javascript
body: <p>Problem: I want to display only the result for one <code>&lt;li&gt;</code> element, not for all of them.</p>
  
  <p>If you have any questions please do ask. </p>
  
  <p>Javascript:</p>
  
  <pre><code>function func1(i){
    $('el[i] ~ span#showOrNo').css({'display':''}); //doesn't work
    //$('span#showOrNo').css({'display':''}); this works, but displays all elements
  }
  
  function func2(i){
    $('el[i] ~ span#showOrNo').css({'display':'none'});
    //$('span#showOrNo').css({'display':'none'});
  }
  
  var el = $('li');
  for(var i = 0; i &lt; el.length; i++){
    el[i].addEventListener('mouseover', function(){
      func1(i);
    }, false);
    el[i].addEventListener('mouseout', function(){
      func2(i);
    }, false);
  }
  </code></pre>
  
  <p>Html:</p>
  
  <pre><code>{% for song in songs %}
    &lt;li&gt;
      &lt;div&gt;
        &lt;span&gt;{{ song.name }}-{{ song.artist }}&lt;/span&gt;
        &lt;div id="showOrNo", style='display:none'&gt;
          {% if song.attr %}
          &lt;span&gt;{{ song.attr }}&lt;/span&gt;
          {% else %}
          &lt;span&gt;{{ song.change }}&lt;/span&gt;
          {% endif %}
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/li&gt;
  </code></pre>