Q:

how to set time duration based on order of element in jquery

I have a ul which may or may not have lis in it!
If there is any li, then on click of #something the first li should fade out in 500ms, second in 1000ms and so on!
I've used this code but not only it doesn't work but doesn't let any other code to work!! 
Thanks for help!!
jquery:
 $('nav ul li').addClass('main');

 $('li').addClass('main'); 
   $("#something").click(function() {
      dothat();
      function dothat(){
         for(var x=0,x>0,x++){
         $("li.main").eq(x).fadeToggle(500*x);
         }
      };
   });

html:
<ul>
  <li>
    <!--sometext-->
    </li>
  <li>
    ...
</ul>

A:

Try this

$('li').addClass('main'); 
$("#something").click(function() {
    $lis = $("li.main");
    for(var x=0;x<$lis.length;x++){
        $lis.eq(x).fadeToggle(500*x);
    };
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<h3 id="something"> Click here </h3>
<ul>
  <li> li 1 </li>
  <li> li 2 </li>
  <li> li 3 </li>
  <li> li 4 </li>
    ...
</ul>

