Почему addClass не работает в этом коде

Question

В приведенном ниже коде моей функции, когда я использую CSS, она работает нормально.когда я добавляю этот CSS в класс, он не работает

function setTab(selection) {
        $("#"+selection).css('background', '#CC0000');
        $("#"+selection).css('color', '#ffffff');   
        // Both the Above statements works fine     
        $("#"+selection).addClass("selectedclass");//doesnot work 
    }   

    .selectedclass li{
        background: #CC0000;
        color: #ffffff;
    }

Answer 1

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

Попробуйте:так что это, наверное, правильно.Но вы могли бы привести это в порядок так:

function setTab(selection)
{
    if ( typeof(selection) == "string" )
    {
        $( '#' + selection ).addClass( "selectedclass" );
    }
}   

Answer 2

Возможно ли, что существует более конкретный селектор, чем применяемый селектор класса? Вы смотрели на элемент в Firebug, чтобы увидеть, где элемент получает свои свойства? Используя первые два оператора, вы устанавливаете стиль непосредственно для элемента, который будет иметь приоритет. Использование второго будет зависеть от различных стилей, которые вы определили, их порядка и специфики. Возможно также, что ваш класс применяется к неправильному элементу, то есть непосредственно к li вместо родительского ul (ol). В этом случае вам нужно изменить правило на li.selectedClass.

Кроме того, знаете ли вы, что вы можете связать функции jQuery вместе? И css имеет перегрузку, которая принимает карту пар ключ / значение.

function setTab(selection) {
    $("#"+selection).css({'background-color': '#CC0000', 'color' : '#ffffff'});
}