title: Get index of child using jQuery
body: <p>I want to get the index of the clicked child</p>
  
  <pre><code>&lt;div class="parent"&gt;
      &lt;div class="child"&gt;
          &lt;div class="c1"&gt;&lt;/div&gt;
          &lt;div class="c2"&gt;&lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="child"&gt;
          &lt;div class="c1"&gt;&lt;/div&gt;
          &lt;div class="c2"&gt;&lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="child"&gt;
          &lt;div class="c1"&gt;&lt;/div&gt;
          &lt;div class="c2"&gt;&lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>jQuery:</p>
  
  <pre><code>$('.child .c1').click(function(){
      alert($(this).parent().index())
  })
  </code></pre>
  
  <p>I always get -1. How can i do this work?</p>
  
  <hr>
  
  <p>EDIT:</p>
  
  <p>I tried this:</p>
  
  <pre><code>$('.child .c1').click(function(){
      alert($(this).index())
  })
  </code></pre>
  
  <p>The result is -1 all the time.
  What could be wrong?</p>