javascript checkbox checked when clicked in the row

I have a Datatable in which i am trying to show a check box and when clicked on any row its checkbox will be checked

this is my table

<table class="bt-datatable table table-striped" id="bt-user-datatable">
    <thead>
    <tr>
      <th><input type="checkbox" name="select_all" value="1" id="bt-select-all"></th>
      <th class="text-left">name</th>
      <th class="text-left">gender</th>
      <th class="text-left">class</th>
    </tr>
    </thead>
    <tbody>
    <%
         @user.each do |user|

    %>
            <tr class="bt-users-row">
              <td class="text-left"><input type="checkbox" value="<%= user.id %>"></td>
              <td class="text-left"><%= user.name %></td>
              <td class="text-left"><%= user.gender %></td>
              <td class="text-left"><%= user.class %><div 
            </tr>
    <% end %>
    </tbody>
  </table>

and in the javascript i have

var usersinfotable =  $('#bt-user-datatable').DataTable(
            {
                info: false,
                responsive: true,
                paging: true,
                pageLength: 10,

                'order': [[1, 'asc']]
            }
    );


    $('#bt-select-all').on('click', function(){
            var rows = usersinfotable.rows({ 'search': 'applied' }).nodes();

            $('input[type="checkbox"]', rows).prop('checked', this.checked);
        });

        $('#bt-user-datatable tbody').on('change', 'input[type="checkbox"]', function(){
            if(!this.checked){
                var el = $('#bt-select-all').get(0);
                if(el && el.checked && ('indeterminate' in el)){
                    el.indeterminate = true;
                }
            }
        });

    $('.bt-users-row').on('click', function(){
            var checkBox = $(this).find('input[type="checkbox"]');
            if (checkBox.is(':checked')){
                checkBox.prop("checked", false);
            }
            else if (!checkBox.is(':checked')) {
                checkBox.prop("checked", true);
            }
        });

so in this what i am trying to do is when i click in the row it automatically select the respected checkbox but , i am having an issue is when i click on the checkbox , it does not check it