A simple script to add an expanding "read more" button to your page content on WordPress using a shortcode.

read_more_functions.js

/**************************************************
 
    >> Read More Shortcode <<
 
**************************************************/
jQuery(document).ready(function() {
  //Set the content area as a variable
  var moreContent = jQuery('.read_more_content');
  //Auto hide the hidden content by default
  moreContent.slideUp();
});
function readMoreToggle( revealButton ) {
  var moreContent = revealButton.prev('.read_more_content');
  if( moreContent.hasClass('open') ) {
    var $button_text = revealButton.attr('data-expand');
    moreContent.slideUp().removeClass('open');
    revealButton.text($button_text);
  } else { //If the content is not showing
    var $button_text = revealButton.attr('data-contract');
    moreContent.slideDown().addClass('open');
    revealButton.text($button_text);
  }
}
jQuery('.revealContent').click(function() {
  readMoreToggle( jQuery(this) );
});
 
jQuery(document).ready(function() {
  jQuery('.us_button').removeClass('us_native');
});

read_more_shortcode.php

<?php

/* ////////////////////////////////////////////////////////////////////////////////////////
    //  Read More Shortcode  \\
//////////////////////////////////////////////////////////////////////////////////////// */
//add [read_more]...[/read_more] shortcode
function shortcode_read_more($atts, $content=null) {
  $more_content = '<div class="read_more_content">';
  $more_content.= $content;
  $more_content.= '</div>';
  return $more_content;
}
add_shortcode('read_more', 'shortcode_read_more');