Jquery toggle show and hide text change -
i've been hunting awhile , can't find answer or work want.
right have content hidden, expands down when clicked on "read more" when been clicked, text changed "less" or "hide" or something.
here code.
$(document).ready(function () { $('.moreinfo').hide(); $('.more').click(function () { $('#info'+$(this).attr('target')).toggle(500); return false; }); });
then goes html
<p class="moreinfo" id="info1">content here</p> <a class="more" target="1">read more</a>
any appreciated! thank you.
you can use callbacks here jsfiddle
$('.moreinfo').hide(); $('.more').click(function (ev) { var t = ev.target $('#info' + $(this).attr('target')).toggle(500, function(){ $(t).html($(this).is(':visible')? 'i\'m done reading more' : 'read more') }); return false; });
you can read more jquery.toggle(), here