howto find a child and count it.

howto find a child and count it.

 Hi People,

I got a kind of a problem. I want to count the childs and than do it with * 20px so the menu know howto slide

So for example, the first menu has: ul li.top ul and in the ul is just one li. than the margin top must be $(this).stop().animate({ marginTop: '-=20px'}, 350 );

but if you look at the second menu the ul counts 6 times the li. So it must be 6*20 px
$(this).stop().animate({ marginTop: '-=120px'}, 350 );


This is my code

   
  1.  $(document).ready(function() {
  2.        $("li.top").hover(function() {
  3.            $(this).stop().animate({ marginTop: '-=100px'}, 350 );
  4.     },function(){
  5.            $(this).stop().animate({ marginTop: '0px'}, 350 );
  6.     });
  7. });


<ul>
    <li class="top"><a  class="topmenu">Home</a>
        <ul>
           <li><a href="/home//" title="begin pagina">begin pagina</a></li>
        </ul>
    </li>
        <li class="top"><a  class="topmenu">Tandemsprong</a>
            <ul>
                <li><a href="/Tandemsprong/wat-is-het/" title="wat is het ">wat is het </a></li>
                <li><a href="/Tandemsprong/kosten/" title="kosten">kosten</a></li>
                <li><a href="/Tandemsprong/boek-direct/" title="Boek direct">Boek direct</a></li>
                <li><a href="/Tandemsprong/tandem-cadeaubon/" title="Tandem Cadeaubon">Cadeaubon</a></li>
                <li><a href="/Tandemsprong/tandem-arrangement/" title="Tandem arrangement">Arrangement</a></li>
                <li><a href="/Tandemsprong/info-aanvragen/" title="Info aanvragen">Info aanvragen</a></li>
            </ul>
        </li>















so on.....

</ul>



thnks in advance