JSFiddle - React, Tailwind, and code Playground

HTML

<table id="sample_1">
  <thead>
    <tr>
      <th>
        Name
      </th>
      <th class="hidden-xs">
        Gender
      </th>
      <th>
        DOJ
      </th>
    </tr>
  </thead>
  <tfoot>
    <tr>
      <th>
        Name
      </th>
      <th class="hidden-xs">
        Gender
      </th>
      <th>
        DOJ
      </th>
    </tr>
  </tfoot>
</table>

JavaScript

< script type = "text/javascript" >
   function datatable() {
     $.ajax({
       type: "Post",
       url: "WebForm2.aspx/getdata",
       contentType: "application/json; charset=utf-8",
       dataType: "json",
       success: function(data) {
         $('#sample_1').DataTable({
           "aaData": JSON.parse(data.d),
           "columns": [{
             "data": "Name"
           }, {
             "data": "gender"
           }, {
             "data": "doj"
           }]
         });

       },
       error: function(err) {
         alert(err);
       }
     })
   } < /script>