There is a script that, upon click, assigns the class .active to the selector and changes the text of its child element:

 $('.ticket-show-more').on('click', function(){ $(this).toggleClass('active'); $(this).find('span').text('Свернуть'); });

And there is a script that theoretically should work by clicking on the same selector with the class .active , but for some reason it does not work and the text does not change back:

 $('.ticket-show-more.active').on('click', function(){ $(this).find('span').text('Подробнее'); });

How to fix it?

  • because the handler is hung only on those elements that already have the class active - Grundy
  • @Grundy, then how can you change the text in the block by clicking and return it back, by the type of toggle? - JamesJGoodwin

1 answer 1

 $('a.ticket-show-more').on('click', function() { var active = $(this).toggleClass('active').hasClass('active'); $('span', this).text(active ? 'Свернуть' : 'Подробнее'); return false; }); 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <a href="#" class="ticket-show-more"> <span>Подробнее</span> </a>