highlight image class on hover imagemap - image

Question

In addition to this question Highlight text when hover imagemap area and vice versa - using imagemapster I'm searching for a solution to add a class to an image outside the imagemap. The intention is when hovering on a part of the imagemap a line is showing beneath a image above the imagemap. For an example and partly working script (which is based on the question above): http://jsfiddle.net/kyzho2v4/3/
jQuery(document).ready(function ($) {
$('#house').mapster({
mapKey: 'name',
singleSelect: true,
fillOpacity: 0.6,
fillColor: 'FF0000',
//
onMouseover: function (evt) {
var parts = evt.key.split('-');
var part = parts[1];
highlightArea(part);
},
//
onMouseout: function (evt) {
var parts = evt.key.split('-');
var part = parts[1];
highlightAreaX(part);
}
});
//
$('a').hover(function () {
var parts = $(this).closest('div').attr('class').split('-');
var part = parts[2];
highlightArea(part);
});
//
$('a').mouseleave(function () {
var parts = $(this).closest('div').attr('class').split('-');
var part = parts[2];
highlightAreaX(part);
});
});
//
function highlightArea(key) {
$('area[name=part-' + key + ']').mouseenter();
$('a').addClass('line');
$('div.menu-item-' + key + ' a').addClass('line');
}
//
function highlightAreaX(key) {
$('area[name=part-' + key + ']').mouseout();
$('a').removeClass('line');
$('div.menu-item-' + key + ' a').removeClass('line');
}

Answer 1

Posted OP's answer as an answer:
I found a solution, so for those who are searching the same thing: I only added a new css class (line1) and changed the jquery script a little bit: http://jsfiddle.net/88c0odmn/7/
//
function highlightArea(key) {
$('area[name=part-' + key + ']').mouseenter();
$('div.menu-item-' + key + ' a').addClass('line1');
}
//
function highlightAreaX(key) {
$('area[name=part-' + key + ']').mouseout();
$('a').removeClass('line');
$('div.menu-item-' + key + ' a').removeClass('line1');
}