title: Iterate over html elements with same class using .each
body: <p>I have some div elements with the same class. I want to iterate through them. I am using jquery ".each" in order to do it. I also want to access each element individually and toogle its class so I need to get the index of the element within the class elements array. I currently have a code similar to this:</p>
  
  <pre><code> $('.the_div_class').each(function(i, obj) {
  
     if("a certain condition") {
  
      $('.the_div_class')[0].toggleClass('other_div_class'); // trying to access the index 0 of the array that contains the elements of that class;
  
     }
  
   }
  </code></pre>
  
  <p>However I receive an error saying "$(...)[0].toggleClass is not a function". If I don't specify an index I toogle all the elements of the array... I console.log the "$('.the_div_class')" array and get a structure similar to this:</p>
  
  <pre><code>[div.the_div_class, div.the_div_class, div.the_div_class, div.the_div_class, div.the_div_class, prevObject: r.fn.init[1]]
  </code></pre>
  
  <p>And if I console.log "$('.the_div_class')[0]" I get this:</p>
  
  <pre><code>&lt;div class="the_div_class"&gt;
  </code></pre>
  
  <p>Why doesn't it work and what should I do in order to make it work?</p>