0

Подскажите как при клике по кнопке

<button class="btn btn-list" data-toggle="collapse" data-target="#hide-me">
  Узнать больше 
  <i class="fa fa-hand-o-down" aria-hidden="true"></i>
</button>

текст - "узнать больше" заменить на "скрыть" + вместо

<i class="fa fa-hand-o-down" aria-hidden="true"></i>

поставить

<i class="fa fa-hand-o-up" aria-hidden="true"></i>

и наоборот.

0

1 ответ 1

3

$('.btn-list').on('click',function() {
    if (!$(this).hasClass('active')) {
        $(this).html('Скрыть <i class="fa fa-hand-o-up" aria-hidden="true"></i>');
    } else {
        $(this).html('Узнать больше <i class="fa fa-hand-o-down" aria-hidden="true"></i>');
    }
    $(this).toggleClass('active');
});
.fa.fa-hand-o-down:before {
content:'down';
}
.fa.fa-hand-o-up:before {
content:'up';
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button class="btn btn-list" data-toggle="collapse" data-target="#hide-me">
  Узнать больше 
  <i class="fa fa-hand-o-down" aria-hidden="true"></i>
</button>

CSS тут только для демонстрации.

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.