JavaScript / jQuery: Add 'Show more / show less' link at bottom of block to show/hide more content

more-less.js

$(function () {
  // Hide the extra content initially (or could be done using css / inline style attribute)
	$('.more-content').hide();
  // Add 'show more' text beneath the main content
	$(".more-less").append('<div class="adjust" style="cursor:pointer">Show more \u25bc</div>');
  // Show hidden content when 'show more' selected
	$('.more-less').on('click', '.adjust', function (e) {
		$(this).siblings('.more-content').slideToggle();
    // Change to 'show less' when extra content is visible
		($(this).text() === 'Show more \u25bc') ? $(this).text('Show less \u25b2') : $(this).text('Show more \u25bc');
	});
});