title: jQuery toggle switch checkbox - changing "checked" attribute delay
body: <p>I created a toggle switch checkbox and aplied the logic below:</p>
  
  <p>1] If user clicks on toggle switch <code>class="os_section-slider"</code> the script will check if the <code>input</code> containing element's name is checked.</p>
  
  <p>1-A] If the element is checked then change it to UNchecked and add that element into array named <code>os_tagsToRemove</code></p>
  
  <p>1-B] If the element is UNchecked then change it to checked and add that element into array named <code>os_tagsToAdd</code></p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;span class="os_section-name"&gt;first&lt;/span&gt;
  &lt;input type="checkbox" class="os_section-check" id="first" checked="checked"&gt;
  &lt;label class="os_section-slider" for="first"&gt;&lt;/label&gt;
  
  &lt;div class="line-space-between"&gt;&lt;/div&gt;
  
  &lt;span class="os_section-name"&gt;second&lt;/span&gt;
  &lt;input type="checkbox" class="os_section-check" id="second"&gt;
  &lt;label class="os_section-slider" for="second"&gt;&lt;/label&gt;
  </code></pre>
  
  <p><strong>JS</strong></p>
  
  <pre><code>$(".os_section-slider").click(function() {
      if($(this).prev().is(":checked")) {   //if checked
          $(this).prev().attr("checked", false);
          var os_tagName = $(this).prev().attr("id").toString();
          os_tagsToRemove.push(os_tagName);
          os_tagsToAdd.splice($.inArray(os_tagName, os_tagsToAdd),1);
      } else {    //if unchecked
          $(this).prev().attr("checked", true);
          var os_tagName = $(this).prev().attr("id").toString();
          os_tagsToAdd.push(os_tagName);
          os_tagsToRemove.splice($.inArray(os_tagName, os_tagsToRemove),1);
      }
  });
  </code></pre>
  
  <p>My problem is, when my page reloads and my toggle switch appears in a modal box and I try to click on the switcher button I have to click 2 times until the checked attribute is added/removed. </p>
  
  <p>The first click always only pushes the value into the array or removes it from the array but doesn't apply <code>$(this).prev().attr("checked", true);</code> nor <code>$(this).prev().attr("checked", false);</code>.</p>
  
  <p>But after the second click on each switcher button, everything from that moment works fine.</p>