Jquery on hover not functioning

Deprecated as of jQuery 1.8: The name "hover" used as a shorthand for the string "mouseenter mouseleave". It attaches a single event handler for those two events, and the handler must examine event.type to determine whether the event is mouseenter or mouseleave. Do not confuse the "hover" pseudo-event-name with the .hover() method, which accepts one or two functions.

Source: http://api.jquery.com/on/#additional-notes

That pretty much says it all, you cant use "hover" for that:

$(document).on('mouseenter','.top-level', function (event) {    $( this ).find('.actionfcnt').show();    $( this ).find('.dropfcnt').show();}).on('mouseleave','.top-level',  function(){    $( this ).find('.dropfcnt').hide('blind', function(){        $('.actionfcnt').hide();    });});

there is no "hover" event.there is .hover() function that takes 2 callbacks (as in your example).

Try:

$(".top-level").on({    mouseenter: function (event) {        $( this ).find('.actionfcnt').show();        $( this ).find('.dropfcnt').show();    },    mouseleave: function (event) {        $( this ).find('.dropfcnt').hide('blind', function(){            $('.actionfcnt').hide();        });    }});

OR

$(".top_level").on("hover", function(event) {  if(event.type == "mouseenter") {    $( this ).find('.actionfcnt').show();    $( this ).find('.dropfcnt').show();  }  else if (event.type == "mouseleave") {    $( this ).find('.dropfcnt').hide('blind', function(){        $('.actionfcnt').hide();    });  }});