Reduce the number of elements I hover
Particularly with your example, I'm not sure if is the kind of functionality what you want, but you can use pure html + css for get a similar approach, using :hover selector. 

http://jsfiddle.net/4cywb3yg/4/

If doesn't work for you, and want to keep your code, I refactored a couple of things.

I think you are add/remove the same class. I extracted in a generic function, and apply independently to each element.

    function setToggles($mainElement, $subElement) {

    var hoverIn = function () {
       $subElement.addClass("shown-sub");
    };

    var hoverOut = function () {
       $subElement.removeClass("shown-sub");
    };       

    $mainElement.hover(hoverIn,hoverOut);
}


Also I extract a couple of variables with the convention $variable for jQuery elements.

Particularly in this example you are using a lot of jQuery selectors,that can be re-use extracting in a variables. (that was the way what i found the extract code)

Also you chain a lot of jQuery calls, Is not bad, but in excess is easy lose who is receive the last message.And can be a mess for human-reading.

http://jsfiddle.net/4cywb3yg/3/