Apply custom css, based on 'if' any children (subnav) present

Apply custom css, based on 'if' any children (subnav) present

Hi all, I am new to jQuery, in learning process..

described below is my dilemma:
I have a 'main' navigation, that display a dropdown / sub navigation where necessary.

I'm trying to achieve the following -
1) considering the parent tab has no associated page, I want to ..
a) disable the 'click' through
b) add custom css property 'cursor:default' to parent tab, containing a 'ul' element (which is in fact, the dropdown menu)


Problem?
With the code pasted below, i've successfully achieved the custom css.. problem -
not working as intended.
a) custom css styling, is being applied to 'all' anchor elements in top navigation
b) custom css styling also being applied to 'children' anchor elements



  1. /*MAIN NAV, APPLY CUSTOM
  2. CSS BASED ON 'IF' ANY CHILDREN (SUBNAV) PRESENT*/
  3.     $("ul.nav.top li a").hover(function() {
  4.         if ($(this).has('ul.dropdown')) {
  5.         $(this).css("cursor", "default");
  6.         }
  7.         //revert to standard 'pointer' for child anchor elements
  8.         $("ul.dropdown li a").css("cursor", "pointer");
  9.     });