Tell me how when you click on the button

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

text - "learn more" replace with "hide" + instead

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

to put

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

and vice versa.

    1 answer 1

     $('.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 is just for demonstration.