jQuery触发器，当<li>添加到<ul>

我有一个PHP页面，使用flush()和ob_flush()向浏览器输出进度。页面正在输出一个样式化的<ul class="progresslog">，其中各个<li class="{success|warning|error}">元素正在刷新到浏览器。

我希望任何成功被隐藏，但任何错误显示。目前，任何错误都将在成功的进度通知中"丢失"。这很容易实现，使用<li>上的不同类和一些jQuery .slideUp()和.slideDown()方法来显示成功，如果用户希望看到它们。

然而，假设进度成功，则不会显示任何内容给用户，用户也不会关心是否有进度。我想要一个摘要链接文本更新，因为额外的<li>被添加到列表中，以显示22 success notifications的内容。我希望这个数字在接收到输出时不断攀升。

我有代码来更新<a id="progresslogtoggle">元素中包含的文本。它看起来像这样:

function updateProgress()
{
    var count = $('.progresslog .success').length;
    var warnings = $('.progresslog .warning').length;
    var errors = $('.progresslog .error').length;
    if (count > 0)
    {
        $('#progresslogtoggle').html ('Show ' + count + ' success notice' + (count != 1 ? 's' : '') + '. (' + warnings + ' warning' + (warnings != 1 ? 's' : '') + ' and ' + errors + ' error' + (errors != 1 ? 's' : '') + ' already shown)');
    }
    else
    {
        $('#progresslogtoggle').html ('There are no success notices to show! (' + warnings + ' warning' + (warnings != 1 ? 's' : '') + ' and ' + errors + ' error' + (errors != 1 ? 's' : '') + ' already shown)');
    }
}

目前，一旦列表完成并添加了最终的</ul>，我还添加了一个JavaScript片段来调用这个updateProgress()函数。

然而，我想有更新的项目被添加到列表中的链接。我试过了:

$('.progresslog').on ('change', updateProgress());

，但是它似乎没有将添加子列表注册为更改列表。

我该如何解决这个问题?

更新:

PHP代码(大大简化，但足以说明这一点):

echo "<a href='"javascript:void(0);'" id='"progresslogtoggle'">Please wait...</a></p>";
echo '<ul class="progresslog">';
// JS, as above, goes here, including an initial call to the function.
for ($i = 0; $i < 1000; $i ++)
{
    // some lengthy process that takes time
    sleep (1); // NOT REAL CODE!
    echo '<li class="';
    echo ($i % 5 == 0) ? 'warning' : 'success';
    echo '">Notice ' . $i . '</li>';
    flush ();
    @ob_flush ();
}
echo "</ul>";
echo "<script type='"text/javascript'">updateProgress();</script>";

免责声明:我意识到使用不完整的DOM是不好的，我不想在这里争论这个问题。