Рекурсивно удаляйте символы из строки, пока указанная строка не будет соответствовать фиксированной ширине

Question

Согласно заголовку, я пытаюсь удалить символы из конца строки, пока ширина строки не совпадет с шириной родительских элементов.

Кажется, что следующее не работает.

                    var $list = $('#market_update_content').find('li'),
                    $i = $list.length,
                    $listWidth = $list.outerWidth(),
                    $listWidth = 200;

                    while ($i--) {

                        var $headLine = $($list[$i]).find('.headline'),
                        $headlineWidth = $headLine.outerWidth(),
                        $dateWidth = $($list[$i]).find('.date').outerWidth(),
                        $contentWidth = $headlineWidth + $dateWidth,
                        $difference = $contentWidth - $listWidth;

                        while ($contentWidth >= $listWidth) {
                            $headLine.slice(0, -1);
                        }
}

Answer 1

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

См. http://jsfiddle.net/FGADG/5/

$('li').each(function() {
    var listWidth = $(this).outerWidth(),
        headLine = $(this).find('.headline'),
        dateLine = $(this).find('.date'),
        headlineWidth = headLine.outerWidth(),
        dateWidth = dateLine.outerWidth(),
        contentWidth = headlineWidth + dateWidth;

    var html = headLine.html();
    for (var i = html.length-1; i >= 0; i--) {
        if (contentWidth >= listWidth) {
            headLine.html(html.substr(0, i));
            headlineWidth = headLine.outerWidth();
            dateWidth = dateLine.outerWidth();
            contentWidth = headlineWidth + dateWidth;
        }
        else
            break;
    }
});