Toggle All Switch

<div class="callout" id="switch-toggle-all">

  <div class="switch-toggle-wrapper">
    <div class="switch">
      <input class="switch-input" id="exampleSwitch1" type="checkbox" name="exampleSwitch" data-toggle-all>
      <label class="switch-paddle" for="exampleSwitch1">
        <span class="show-for-sr">Toggle All</span>
      </label>
    </div>
    <span>Toggle All</span>
  </div>

  <hr />

  <div class="switch-toggle-wrapper">
    <div class="switch">
      <input class="switch-input" id="exampleSwitch2" type="checkbox" name="exampleSwitch2">
      <label class="switch-paddle" for="exampleSwitch2">
        <span class="show-for-sr">Automatic Updates</span>
      </label>
    </div>
    <span>Automatic Updates</span>
  </div>

  <div class="switch-toggle-wrapper">
    <div class="switch">
      <input class="switch-input" id="exampleSwitch3" type="checkbox" name="exampleSwitch3">
      <label class="switch-paddle" for="exampleSwitch3">
        <span class="show-for-sr">Sync Daily</span>
      </label>
    </div>
    <span>Sync Daily</span>
  </div>

  <div class="switch-toggle-wrapper">
    <div class="switch">
      <input class="switch-input" id="exampleSwitch4" type="checkbox" name="exampleSwitch4">
      <label class="switch-paddle" for="exampleSwitch4">
        <span class="show-for-sr">Location</span>
      </label>
    </div>
    <span>Location</span>
  </div>

  <div class="switch-toggle-wrapper">
    <div class="switch">
      <input class="switch-input" id="exampleSwitch5" type="checkbox" name="exampleSwitch5">
      <label class="switch-paddle" for="exampleSwitch5">
        <span class="show-for-sr">push notifications</span>
      </label>
    </div>
    <span>Push Notifications</span>
  </div>

</div>

$('#switch-toggle-all [data-toggle-all]' ).click(function () {
  $( '#switch-toggle-all input[type="checkbox"]').prop('checked', this.checked)
})