JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.jquery.com/jquery-3.6.1.min.js" type="text/javascript"></script>
<script src="//cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js"></script>

<table id="live_table" class="table sortable table-hover">
  <thead>
    <th>Num Values</th>
  </thead>
</table>

JavaScript

var dataSet = [{'num_values': '44.44'},{'num_values': '1.44'},{'num_values': '22.44'},{'num_values': '2.64'},{'num_values': '3.11'},{'num_values': '50.22'},{'num_values': '6.51'}]
 
 var table = $('#live_table').DataTable( {
            data: dataSet,
            //columnDefs: [
            //  {
            //    targets: 0,
            //    "type": "num"
            //  }
           // ],
            columns: [
            {
            
                data: "num_values", 
                "render": function ( data, type, row, meta ) {
                
                	if (type === 'sort' || type === 'type') {
                  	return parseFloat(data);
                  }
                  
                  return data;

               }
              }
              ]
            })