Increase visible text on click.

Increase visible text on click.

I am trying to increase the words that are visible when user clicks on the link. It does not seem to listen to the  click command. How can I achieve this? My code looks like below. 

  1. $(document).ready(function () {

  3. var $wordCount = 12;


  6. $("h2").on("click", function () {
  7. var $wordCount = 112;
  8. });


  11. function getWords(str) {
  12.     return str.split(/\s+/).slice(0, $wordCount).join(" ");
  13. }

  15. var str = $(".hider").text();
  16. $(".showHere").text(getWords(str));
  17. });

See work on fiddle