jquery - タイマー値に基づいて css を追加する

Question

タイマーが 30 秒以下になったことに基づいて、フォントの色を変更しようとしています。このカウントダウンプラグインをタイマーとして使用しています。これまでのところ、色などを変更することはできますが、時間などに関係なく追加されます。jQuery は初めてなので、どんな助けも大歓迎です!

$(document).ready(function(){

    var seconds = $(".time-increment").val();

    $("#timer").countdown({
        until: +seconds, 
        format: 'MS', 
        layout: '{mn} {ml}, <span class="seconds-actual">{sn}</span> {sl} remaining',
        onExpiry: reload,
        onTick: checkFont
        }); 

    function reload() {
        var id = $("#item-content").attr('class');
        $.ajax({
            type: 'POST',
            url: '../modal_content.adam.php',
            data: 'Qwicksale_id='+id,
            success: function(msg) {
                $("#item-content").hide().html(msg).fadeIn('slow');
            }
        });
    }

});

更新しました

onTick の関数を追加しました - 秒が 30 以下のときだけでなく、スタイル クラスは常に赤くなりますか?

function checkFont(seconds2) {
        if(seconds2[5] == 0 && seconds2[6] <= '30') {
            $('.hasCountdown').css('color', 'red');
        }
    }