Jquery selected index problem

Question

Hi, i am trying to make simple show-hide example but i cant select hidden elements with eq() or not(). Basic structure is like this :

<ul id="info">
  <li><a href="#">İletişim Adreslerimiz</a></li>
  <li><a href="#">Kroki</a></li>
 </ul>
 <ul id="info-ic">
  <li><p>Adres Bilgilerimiz</p></li>
  <li><p>Kroki Bilgisi</p></li>
 </ul>

and jquery code :

$('#info > li').click(function(){
 $('#info-ic').find('li:eq('+$(this).index()+')').show();
 $('#info-ic').find('li:not('+$(this).index()+')').hide();
});

Answer 1

find() searches the descendants of the selected elements, not the elements themselves. Use:

$('#info-ic > li:eq(' + $(this).index() + ')')
$('#info > li:eq(' + $(this).index() + ')')

Or:

$('#info-ic').children('li:eq(' + $(this).index() + ')')
$('#info').children('li:eq(' + $(this).index() + ')')