title: Toggle checkboxe show/hide using Jquery
body: <p>I have the below table populated with data using AJAX/JSON
  When I click on a particular row, it populates some textboxes with values from the table row which works fine,based on a value in the row, I will either hide or show some checkboxes but I cant get that part to work.
  Below is my code,dont know what am doing wrong.
  Thanks for your help in advance</p>
  
  <pre><code>    &lt;script type="text/javascript"&gt;
      $(document).ready(function () {
          "responsive"; true,
          "serverSide"; true,
          "info"; true,
          "stateSave"; true,
       $.ajax({
           type: "POST",
           dataType: "json",
           url:"CustomerService.asmx/GetCustomer",
           success: function (data) {
               var datatableVariable = $('#dtCustomers').DataTable({
  
                   data: data,
                   columns: [
                       { 'data': 'iD' },
                       { 'data': 'AccountNumber' },
                       { 'data': 'Name' },
                        { 'data': 'FirstName' },
                         { 'data': 'LastName' },
                          { 'data': 'Balance' },
                           { 'data': 'TypeOfAccount' }
                   ],
                   columnDefs: [
               { "visible": false, "targets": 0 },
                { "visible": false, "targets": 3 },
                 { "visible": false, "targets": 4 },
                 { "visible": false, "targets": 6 }
                   ]
               });
               datatableVariable.columns().every(function () {
                   var column = this;
                   $(this.footer()).find('input').on('keyup change', function () {
                       column.search(this.value).draw();
                   });
               });
               $('.showHide').on('click', function () {
                   var tableColumn = datatableVariable.column($(this).attr('data-columnindex'));
                   tableColumn.visible(!tableColumn.visible());
               });
  
  
               $('#dtCustomers').on('click', 'tr', function () {
  
                   var data = datatableVariable.row(this).data();
                   $(document.getElementById('&lt;%= customerids.ClientID %&gt;')).val(data.iD);
                   $(document.getElementById('&lt;%= lblFnames.ClientID %&gt;')).val(data.FirstName);
                   $(document.getElementById('&lt;%= lblLnames.ClientID %&gt;')).val(data.LastName);
                   $(document.getElementById('&lt;%= lblacc.ClientID %&gt;')).val(data.AccountNumber);
                   $(document.getElementById('&lt;%= lblBals.ClientID %&gt;')).val(data.Balance);
                   $(document.getElementById('&lt;%= acctypes.ClientID %&gt;')).val(data.TypeOfAccount);
                   //debugger;
                   switch (data.TypeOfAccount) {
                       case 0:
                           $(document.getElementById('&lt;%= chkNCs.ClientID %&gt;')).hide
                           $(document.getElementById('&lt;%= chkODs.ClientID %&gt;')).hide
                           $(document.getElementById('&lt;%= chkRODs.ClientID %&gt;')).hide
                           break;
                       case 4:
                           $(document.getElementById('&lt;%= chkNCs.ClientID %&gt;')).visible
                           $(document.getElementById('&lt;%= chkODs.ClientID %&gt;')).visible
                           $(document.getElementById('&lt;%= chkRODs.ClientID %&gt;')).visible
                           break;
  
                       default:
  
                   }
               });
           }
       });
      });
  
  &lt;/script&gt;
  &lt;div class=""&gt;
     &lt;ul style="list-style-type:none;float:left;display: inline;margin:0;padding:0;"&gt;
        &lt;li class="list"&gt;&lt;asp:CheckBox runat="server" id="chkRODs" name="chkRODs"  Text="Repayment of OD" visible="false"/&gt;&lt;/li&gt;
        &lt;li class="list"&gt;&lt;asp:CheckBox runat="server" id="chkODs" name="chkODs"  Text="Interest on Repayment" visible="false" /&gt;&lt;/li&gt;
       &lt;li class="list"&gt;&lt;asp:CheckBox runat="server" id="chkNCs" name="chkNCs"  Text="Non-Cash Transaction" visible="false" /&gt;&lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p></p>