Изменить высоту элемента, если он переполнен

Question

Я использую jQuery и у меня есть виджет аккордеона. Я размещаю контент внутри каждого контейнера динамически. Мне будет нравиться расти аккордеон (рост высоты), когда я помещаю новый контент в новый элемент управления. Мой аккордеонный контроль выглядит так:

Я инициализирую виджет аккордеона моих проектов как:

$("#accordion").accordion({
                autoHeight: false,
                navigation: true,
                collapsible: true,
                fillSpace: true

            });

Когда я динамически размещаю HTML внутри этого аккордеона с Ajax, вы можете видеть, что элементы начинают переполняться. Я не хочу видеть полосы прокрутки.

Так что я думал о донге что-то вроде:

somehow with JavaScript see if an element on the dom is overflowing (has the scroll bar)

if it does then increase it's height by 10 px until it does not overflow. 

Я знаю, что могу установить фиксированную высоту, но я не знаю, сколько HTML-контента я буду размещать в каждом аккордеоне заранее. Что вы, ребята, предлагаете, как решить эту проблему?

EDIT

Было бы хорошо, если бы я мог решить эту проблему с помощью CSS, так как я создаю виджет аккордеона динамически.

Answer 1

После добавления контента позвоните;

$("#accordion").accordion( "resize" );

Answer 2

Я работал над этим, и у меня есть:

function removeOverflow(element){
     var newHeight = $(element).height() + element.offsetHeight; 
    $(element).height(newHeight+"px")  // set the hight of the overflowing element
}