title: checkboxes not styled after ajax call
body: <p>I have a script file scripts.js with a function that styles all checkboxes in page. This file is referenced in the master page.</p>
  
  <p>There is a user control and a aspx test page for it. On page load, the UC shows a list of checkboxes and the style is applied.</p>
  
  <p>On clicking a button, an ajax call gets a list from database and binds some more checkboxes to the page. But for the new checkboxes, the style is not applied. What could be going wrong.</p>
  
  <p><strong>scripts.js:</strong></p>
  
  <pre><code>function selectcheckBtn() {   
      alert(1); 
      if ($("input:checkbox").prev("span").length === 0) {
          alert(2); 
          $("&lt;span class='uncheked'&gt;&lt;/span&gt;").insertBefore("input:checkbox")
      }
      $("input:checkbox").click(function () {
          check = $(this).is(":checked");
          if (check) {
              $(this).prev("span").addClass("cheked").removeClass("uncheked")
          } else {
              $(this).prev("span").addClass("uncheked").removeClass("cheked")
          }
      });
      $("input:checked").prev("span").addClass("cheked").removeClass("uncheked")
  }
  </code></pre>
  
  <p><strong>ctrl.ascx:</strong></p>
  
  <pre><code>&lt;script&gt;
  function ShowMore() {
          $.ajax({
              url: "/_layouts/15/handlers/ShowMore.ashx",            
              data: {},
              success: function (msg) {    
  //append new chkbox list to existing list. It is hidden at first and later faded in.               
                  $(".divList").append(msg); 
                      selectcheckBtn();
                      $(".hideDiv").fadeIn(300).removeClass("hideDiv");                    
                  },
              error: function (msg) {
                  alert("An error occurred while processing your request");                
              }
          });
      }
  
  &lt;/script&gt;
  &lt;a href="javascript:;" id="btnMore" runat="server" onclick="ShowMore();"&gt;Show more &lt;/a&gt;
  </code></pre>
  
  <p>On page load both alerts pop. But on clicking 'Show More', only alert(1) pops. </p>
  
  <p>There are no errors in browser console.</p>
  
  <p><strong>Rendered HTML:</strong></p>
  
  <pre><code>//with style applied to chkboxes on page load
  &lt;div&gt;&lt;span class="uncheked"&gt;&lt;/span&gt;&lt;input type="checkbox" runat="server"  id="406"&gt;
  &lt;label&gt;Compare&lt;/label&gt;&lt;/div&gt;
  
  //with no style applied to new chkboxes
  &lt;div&gt;&lt;input type="checkbox" runat="server" id="618"&gt;&lt;label&gt;Compare&lt;/label&gt;&lt;/div&gt;
  </code></pre>