Написание JQuery If заявление

Question

Я пытаюсь написать JQuery If Statement .. В основном я пытаюсь выделить соответствующую ссылку (a) при нажатии на определенный div (infotab). Все они скрыты, как вы можете видеть, но при щелчке они становятся видимыми и исчезают. Я хочу выделить элемент, на который нажали. (Измените цвет фона на любой, какой я хочу, например красный в коде ниже.)

Код, который я имею ниже, работает, но неправильно. Это выдвигает на первый план все a в этом div. Я просто хочу, чтобы тот, который выделен, был нажат. Спасибо за вашу помощь, ребята, вы молодцы.

$(document).ready(function () {
    $('#infotab_two_s, #infotab_three_s, #infotab_four_s, #infotab_five_s').hide();
});

$('.subnav_holster li').click(function () {
    var Vinfotab = this.id + '_s';
    $('.infotab:visible').fadeOut('fast', function () {
        $('#' + Vinfotab).fadeIn('fast');
        var Vinfotab_selected = 'Vinfotab:visible';
        $("subnav_holster li a").css({
            "color": "red"
        });
    });
});

Answer 1

Возьмите li, на который нажали, и получите доступ к элементу a:

$('.subnav_holster li').click(function () {
    var Vinfotab = this.id + '_s';
    var clicked = $(this);
    $('.infotab:visible').fadeOut('fast', function () {
        $('#' + Vinfotab).fadeIn('fast');
        var Vinfotab_selected = 'Vinfotab:visible';
        clicked.find('a').css({
            "color": "red"
        });
    });
});

Answer 2

Вы должны кешировать this, а затем выделить его:

$('.subnav_holster li').click(function () {
    var Vinfotab = this.id + '_s',
        $this = $(this);
    $('.infotab:visible').fadeOut('fast', function () {
        $('#' + Vinfotab).fadeIn('fast');
        var Vinfotab_selected = 'Vinfotab:visible';
        $('.subnav_holster li a').css({
            "background-color": "white" // reset all to default color
        });
        $this.find('a').css({
            "background-color": "red"   // set highlight to this element only
        });
    });
});