JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//code.jquery.com/jquery-1.12.0.min.js"></script>
<script src="//cdn.datatables.net/1.10.10/js/jquery.dataTables.min.js"></script>
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.10/css/jquery.dataTables.min.css">
<table id="example">

</table>

<table id="example1">

</table>

JavaScript

var dataSet = [
    [ "<input type='radio' name='row_1' checked>"
    , "<input type='radio' name='row_1'>"
    , "<input type='radio' name='row_1'>"
    ]
    ,
    [ "<input type='radio' name='row_2' checked>"
    , "<input type='radio' name='row_2'>"
    , "<input type='radio' name='row_2'>"
    ]
    ,
    [ "<input type='radio' name='row_3' checked>"
    , "<input type='radio' name='row_3'>"
    , "<input type='radio' name='row_3'>"
    ]
    ,
    [ "<input type='radio' name='row_4' checked>"
    , "<input type='radio' name='row_4'>"
    , "<input type='radio' name='row_4'>"
    ]
]

$(document).ready(function() {
  $('#example').DataTable( {
  autoWidth: false,
    data: dataSet,
    columns: [
      { title: "Radio Button 1" }
    , { title: "Radio Button 2"}
    , { title: "Radio Button 3" }
    ]
  });
});

var dataSet1 = [
    [ "<input type='checkbox' name='row_1' checked>"
    , "<input type='checkbox' name='row_1'>"
    , "<input type='checkbox' name='row_1'>"
    ]
    ,
    [ "<input type='checkbox' name='row_2' checked>"
    , "<input type='checkbox' name='row_2'>"
    , "<input type='checkbox' name='row_2'>"
    ]
    ,
    [ "<input type='checkbox' name='row_3' checked>"
    , "<input type='checkbox' name='row_3'>"
    , "<input type='checkbox' name='row_3'>"
    ]
    ,
    [ "<input type='checkbox' name='row_4' checked>"
    , "<input type='checkbox' name='row_4'>"
    , "<input type='checkbox' name='row_4'>"
    ]
]

$(document).ready(function() {
  $('#example1').DataTable( {
    data: dataSet1,
    columns: [
      { title: "CheckBox 1" }
    , { title: "CheckBox 2"}
    , { title: "CheckBox 3" }
    ]
  });
});