toggle - multiple - switch text - if else V2

by ian_smithz

HTML

<h4>
  <p class="right">
    <a class="toggler" data-toggle="delivery-bankholiday">
      <span class="toggler-text">Show details</span>
      <span class="icon icon-up-dir"></span>
      <span class="icon icon-down-dir"></span>
    </a>
  </p>
</h4>


<div id="delivery-bankholiday" style="display: none">
  This is box 1
</div>

<h4>
  <p class="right">
    <a class="toggler" data-toggle="delivery-restrictions-table">
      <span class="toggler-text">Show details</span>
      <span class="icon icon-up-dir"></span>
      <span class="icon icon-down-dir"></span>
    </a>
  </p>
</h4>


<div id="delivery-restrictions-table" style="display: none">
  This is box 2
</div>

JavaScript

(function(){



      console.log('loaded');
        var f = this,
          d = $(f),
          g = d.data("toggle");

        $(this).toggleClass("expanded");

        $("#" + g).slideToggle(1000, function() {
          console.log('inside');
          if ($(this).is(':contains("details")')) {
            $(".toggler-text").text($(".toggler-text").text() == "Show details" ? "Hide details" : "Show details");
          }

        });


    
})();