JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://cdn.datatables.net/1.10.13/js/jquery.dataTables.min.js"></script>
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.13/css/jquery.dataTables.min.css">
<button>Non SC</button>
<table id="example" class="display" cellspacing="0" width="100%">
        <thead>
            <tr>
                <th>Model No</th>
                <th>Part Number</th>
                <th>Description</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>AB1234</td>
                <td>23879-09</td>
                <td>This Model Comes With A SC</td>
            </tr>
            <tr>
                <td>AB1235</td>
                <td>23869-19</td>
                <td>This is a normal Model</td>
            </tr>
            <tr>
                <td>CBZ001</td>
                <td>23869-01</td>
                <td>This is a custom made model which has SC</td>
            </tr>
            <tr>
                <td>INR081</td>
                <td>33869-02</td>
                <td>A standard model which can be customized</td>
            </tr>
            <tr>
                <td>HBR01</td>
                <td>73823-01</td>
                <td>Highly customizable SC model</td>
            </tr>
             <tr>
                <td>YZFR1</td>
                <td>88820-001</td>
                <td>Manufactured only on request. Equipped with SC</td>
            </tr>
            <tr>
                <td>YZFR15</td>
                <td>11120-001</td>
                <td>Mid variant</td>
            </tr>
        </tbody>
    </table>

JavaScript

$(document).ready(function() {
    var table = $('#example').DataTable();
    table.draw();
    } );