Вопрос по уменьшению кода JQ?

Question

[Азат Тагаев]

Всем привет, подскажите пожалуйста, как совместить и сократить эти коды JQ.

$('.animals').on('mouseover', function () {
        var aid = this.id;
        if (aid == 'hov-1') {
            $('.television, .read, .booking, .children, .shot, .explorer, .store, .thing, .support').css('color', '#fff');
            $('.bg_animals').css('opacity', '1');
        }
});

$('.animals').on('mouseout', function () {
        var aid = this.id;
        if (aid == 'hov-1') {
            $('.bg_animals').css('opacity', '0');
        }
});

Answer 1

[Виталий Киренков]

const itemId = 'hov-1';
$('.animals').hover(() => {
    if (this.id === itemId) {
        $('.television, .read, .booking, .children, .shot, .explorer, .store, .thing, .support').css('color', '#fff');
        $('.bg_animals').css('opacity', '1');
    }
}, () => {
    if (this.id === itemId) {
        $('.bg_animals').css('opacity', '0');
    }
});

Но лучше показать вёрстку, тогда я смогу сказать наверняка. Это НУЖНО переделать на переключение простым классом.

$('.animals').hover(() => {
    if (this.id === 'hov-1') {
        $('.television, .read, .booking, .children, .shot, .explorer, .store, .thing, .support').addClass('active');
        $('.bg_animals').addClass('active');
    }
}, () => {
    if (this.id === 'hov-1') {
        $('.bg_animals').removeClass('active');
    }
});

.bg_animals {
    opacity: 0;

    &.active {
        opacity: 1;
    }
}