JSFiddle - React, Tailwind, and code Playground

by xerenader

HTML

<table width="500" height="300" class="my-magicTable">
            <thead>
                <th>Name</th>
                <th>Age</th>
                <th>Address</th>
            </thead>
            <tbody>
                <tr>
                    <td>Rey Zorha</td>
                    <td>20</td>
                    <td>Cainta, Rizal</td>
                </tr>
                <tr>
                    <td>Juan Dela Cruz</td>
                    <td>22</td>
                    <td>Tondo, Manila</td>
                </tr>
            </tbody>
        </table>

JavaScript

$('.my-magicTable thead').css('background', '-webkit-gradient(linear, left top, left bottom, color-stop(0%,#61c419), color-stop(100%,#b4e391))')
                         .css('background', '-moz-linear-gradient(top, #61c419 0%, #b4e391 100%)')
                         .css('background', '-ms-linear-gradient(top, #61c419 0%,#b4e391 100%)')
                         .css('background', 'filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#61c419", endColorstr="#b4e391",GradientType=0 )')