Miért nem működik ez a rendkívül egyszerű jquery kód?

Egyszerűen egy kétszintű menü második szintjét akarom megjeleníteni valahogy. Egyféleképpen tudom, méghozzá úgy, hogy adClass-szel hozzáadok egy új class-t, aminek a display paraméterét block-ra állítom.

1:

Ebben az esetben mindig felismeri a css kódját a webkit transitionnak, csak így nem. Ebben a kódban is van ilyen. Tehát megjelenik, de nem tudok neki durationt beállítani.

2:

Ha animate-tel próbálom, akkor pedig egészen egyszerűen nem működik. Ezt írom be neki:

$(".nav ul li ul").animate({display: "block"}, 500);

Elméletileg meg lehet határozni ilyen paramétert animate-el, de egyszerrűen se mouseover-ként se hoverként se click function-ként nem funkcionál. A css kóddal semmi gond nincs, ha csak szimplán css hover-t állítok be úgy jó, de azt szeretném, hogy animate-tel jöjjön le a menü. El nem tudom képzelni mi a probléma.