JQuery Accodion с дополнительным дополнением

У меня есть этот скрипт, который отлично работает:

Javascript

$('.trigger').not('.trigger_active').next('.toggle_container').hide();
$('.trigger').click( function() {
    var trig = $(this);
    if ( trig.hasClass('trigger_active') ) {
        trig.next('.toggle_container').slideToggle('slow');
        trig.removeClass('trigger_active');
    } else {
        $('.trigger_active').next('.toggle_container').slideToggle('slow');
        $('.trigger_active').removeClass('trigger_active');
        trig.next('.toggle_container').slideToggle('slow');
        trig.addClass('trigger_active');
    };
    return false;
});

Моя структура html выглядит так:

HTML

<div class="group">
<div class="item1">
<div class="trigger"></div>
<div class="trigger_container"></div>
</div>
<div class="item2">
<div class="trigger"></div>
<div class="trigger_container"></div>
</div>
<div class="item3">
<div class="trigger"></div>
<div class="trigger_container"></div>
</div>
<div class="item4">
<div class="trigger"></div>
<div class="trigger_container"></div>
</div>
</div>
<div class="group">
<div class="item5">
<div class="trigger"></div>
<div class="trigger_container"></div>
</div>
<div class="item6">
<div class="trigger"></div>
<div class="trigger_container"></div>
</div>
<div class="item7">
<div class="trigger"></div>
<div class="trigger_container"></div>
</div>
<div class="item8">
<div class="trigger"></div>
<div class="trigger_container"></div>
</div>
</div>

Но когда аккордеон открывается, я хочу, чтобы div-группа получала нижнюю часть с размером высоты div "trigger_content". И с телом, когда аккордеон закрывается, div-группа "gehts" заполняет нижнюю часть "0".

Можете ли вы мне помочь? СПАСИБО