jQuery function only firing once on button click

jQuery function only firing once on button click

I'm having an issue with my function only triggering in one cycle. When I click the Highlight button my text highlights, when I click Un-Highlight the highlighting is removed...however everything stops after this. When I click the Highlight button again nothing happens.  

  1.   <script>
  2.         // Use Strict indicates that the code should be executed in "strict mode" which does not allow for use of undeclared variables.
  3.         "use strict";
  4.         
  5.         $(document).ready(function() {
  6.             //Select button and set click function
  7.             $("#toggleHighlight").click(function (e) {
  8.                 //if button text = Highlight
  9.                 if ($(this).text() == "Highlight") {
  10.                     //assign function only to wording tagged class="hl"
  11.                     $('span.hl').each(function() {
  12.                         var toggle=$(this);
  13.                         toggle.removeClass('h1');
  14.                         toggle.addClass('highlightable');
  15.                         $(this).before(toggle);
  16.                         $("#toggleHighlight").text("Unnnn-Highlight");
  17.                     });
  18.                 } 
  19.                 else 
  20.                 {
  21.                     //Remove highlighted text - revert button text
  22.                     $('span.highlightable').remove();
  23.                     $("#toggleHighlight").text("Highlight");
  24.                 }
  25.             });


  28.         }); // end ready
  29.     </script>