title: How to get multiple checkbox toggle switches values when on change event via jquery
body: <p>I have implemented toggle switch based on checkbox in my website. When I use one toggle switch I can able to get the value of the checkbox which I click. But I when I implement two or more toggle switches I cannot get the value of checkbox which click. It always returning the value of first the checkbox. </p>
  
  <p>You can understand what I'm saying by clicking second toggle switch that I created on the following fiddle.</p>
  
  <p><a href="https://jsfiddle.net/wughm90b/2/" rel="nofollow">https://jsfiddle.net/wughm90b/2/</a></p>
  
  <p>This is my html code:</p>
  
  <pre><code>&lt;div class="switch" id="switch"&gt;
    &lt;input id="cmn-toggle-1" class="cmn-toggle cmn-toggle-round" type="checkbox" checked data-value="one" &gt;
    &lt;label for="cmn-toggle-1"&gt;&lt;/label&gt;
  &lt;/div&gt;
  
  &lt;br&gt;
  
  &lt;div class="switch" id="switch"&gt;
    &lt;input id="cmn-toggle-1" class="cmn-toggle cmn-toggle-round" type="checkbox" data-value="two"&gt;
    &lt;label for="cmn-toggle-1"&gt;&lt;/label&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>This is my jQuery code:</p>
  
  <pre><code>$(document).on("change", ".switch", function () {
      alert($(this).find('input').data('value'));
  });
  </code></pre>