$('document').ready(function(){
    // Get the ID of the body
    var parentID = $("body").attr("id");
    // Loop through the nav list items
    $("#nav li").each(function() {
        // compare IDs of the body and list-items
        var myID = $(this).attr("id");
        // only perform the change on hover if the IDs don't match (so the active link doesn't change on hover)
        if (myID != "n-" + parentID) {
            // for mouse actions
            $(this).children("a").hover(function() {
                // add a class to the list item so that additional styling can be applied to the <em> and the text
                $(this).addClass('over');
                // add in the span that will be faded in and out
                $(this).append("<span></span>");
                $(this).find("span").fadeIn(200);
            }, function() {
                $(this).removeClass('over');
                // fade out the span then remove it completely to prevent the animations from continuing to run if you move over different items quickly
                $(this).find("span").fadeOut(200, function() {
                    $(this).remove();
                });
            });

        }
    });
});

$('document').ready(function(){
    // Get the ID of the body
    // Loop through the nav list items
    $("#undernav li").each(function() {
        // compare IDs of the body and list-items
        var myID2 = $(this).attr("id");
        // only perform the change on hover if the IDs don't match (so the active link doesn't change on hover)
            // for mouse actions
            $(this).children("a").hover(function() {
                // add a class to the list item so that additional styling can be applied to the <em> and the text
                $(this).addClass('over');
                // add in the span that will be faded in and out
                $(this).append("<span></span>");
                $(this).find("span").fadeIn(200);
            }, function() {
                $(this).removeClass('over');
                // fade out the span then remove it completely to prevent the animations from continuing to run if you move over different items quickly
                $(this).find("span").fadeOut(200, function() {
                    $(this).remove();
                });
            });
    });
});