Почему не применяется класс?

Question

[campus1]

https://codepen.io/Slasher_/pen/mwjbvP

Почему не применяется класс active?

Comments

[sergey]

очень странный код

[campus1]

Sagan: В чем странность?

[sergey]

campus1: да во всем, три раза пересмотрел и не понимаю что Вы этим кодом хотите сотворить?

[sergey]

что должно происходить при клике к примеру?

[campus1]

Sagan: У меня есть текст внутри блока, он по дефолту скрытый. По клику на h3 добавляется класс active который имеет inline-block и показывает тот текст

[sergey]

campus1: если это аккордион, то примеров тысячи, зачем делать свое и не правильное

[sergey]

campus1: ну так возьмите любой пример акордиона и используйте

[campus1]

Текст скрытый - prntscr.com/fs25lp
Текст не скрытый - prntscr.com/fs261r

[sergey]

campus1:

$('.accordion a').click(function(j) {
        var dropDown = $(this).closest('li').find('.drop');

        $(this).closest('.accordion').find('.drop').not(dropDown).slideUp();

        if ($(this).hasClass('active')) {
            $(this).removeClass('active');
        } else {
            $(this).closest('.accordion').find('a.active').removeClass('active');
            $(this).addClass('active');
        }

        dropDown.stop(false, true).slideToggle();

        j.preventDefault();
    });

вот пример стандартного акордиона, который при клике открывает невидимую область, присваивает класс и при закрытии убирает этот класс

Answer 1

[Ankhena]

Класс не применяется потому что вес селектора .service__sect-content_accordeon_item p выше, чем у .active
Читайте про специфичность селекторов

Comments

[campus1]

Если добавлю к active !important всё найс, но будет ли это хорошой вёрсткой?

[Ankhena]

campus1 а вообще логика скрипта очень странная.
Зачем без клика, сразу при загрузке задавать inline-block, при этом в стилях display:none?
Посмотрите на стандартные реализации аккордеона, там все очень просто.

[campus1]

Ankhena W: Хорошо. Спасибо!

[Ankhena]

campus1:

Если добавлю к active !important всё найс, но будет ли это хорошой вёрсткой?

нет, это будет отвратительной версткой

Включите разум и не изобретайте велосипед, лучше изучите как это делать правильно и красиво.

Answer 2

[Павел]

а это разве разрешено в названии класа jquery ? :first-child

Comments

[campus1]

Почему нет?
https://api.jquery.com/first-child-selector/

Answer 3

[twobomb]

Поменяй

$(".service__sect-content_accordeon_item:first-child p").addClass('active');

на

$($(".service__sect-content_accordeon_item")[0]).find("p").addClass('active');

Comments

[campus1]

неа(

[twobomb]

campus1: Что неа если добавило к параграфу в первом элементе класс active. Я по диспетчеру посмотрел