jQuery toggle and how to change text -
i'm new jquery bare me.
i'm using toggle feature toggle , forth between div container hidden. when clicking on 'show more' link displays div, , when clicking on 'show less' link hides div.
here code:
$('.transcript').addclass('hide') $(".show-more").click(function(){ $(".transcript").toggle(); $(".transcript").removeclass('hide'); $(".show-more").html('show less'); });
the problem having when click 'show more', displays hidden div , changes text of link 'show less'. however, text of link remains 'show less' when should go 'show more' when div hidden.
thanks in advance!
i think figured out, code seems work:
$('.transcript').addclass('hide'); $('.show-more').on('click', function() { var $this = $(this); if($('.transcript').is(':visible')) { $('.transcript').hide(); $this.text('show more'); } else { $('.transcript').show(); $this.text('show less'); } });
maybe can tell me if code solid or if needs work? works fine on front end, i'm not sure if it's 'clean'.