JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdn.datatables.net/1.10.22/js/jquery.dataTables.min.js"></script>
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.22/css/dataTables.bootstrap4.min.css">
            <table id="example" class="display table-striped" style="width:100%">
        <thead>
            <tr>
                <th>id</th>
                <th>name</th>
                <th>quantity</th>
                <th>status</th>                
            </tr>
        </thead>

    </table>

JavaScript

//The if condition not working if i try to do in this way based on example code below:
//if(data == 'yes' && data.quantity >0) {
// return '<button>View</button>';}

$(document).ready(function() {
         
 $('#example').DataTable( {
        "processing": true,
        "serverSide": true,
 
 "columns": [
            { "data": "id" },
            { "data": "date" },
            { "data": "quantity" },
            { "data": "status",
 
       render: function(data, type, row) {
  
            if(data == 'yes' && data.quantity >0) {
                   
                return '<button>View</button>';
                 
            }else if (data == 'no' && data.quantity == 0) {
 
                  return '<button>Delete</button>';
                   
            }
 }
            }
],
 
});
  });