JSFiddle - React, Tailwind, and code Playground

by raam86

HTML

<div style="margin: 0 auto; text-align: center;">
    <table class="test">
        <tbody>
            <tr id="mytableRows">
                <td class="even">
                    <input type="checkbox" value="true" name="homeLoan">
                </td>
                <td class="odd">
                    <input type="checkbox" value="true" name="autoLoan">
                </td>
                <td class="even">
                    <input type="checkbox" value="true" name="personalLoan">
                </td>
                <td class="odd">
                    <input type="checkbox" value="true" name="noLoan">
                </td>
                <td class="odd">
                    <input type="text" name="peronalAmount" value="1" readonly>
                </td>
            </tr>
        </tbody>
    </table>
</div>

JavaScript

$(document).ready(function () {
    $('.test tr').click(function (event) {
        $(this).find(':checkbox:checked').each(function (p) {
            if (this.name == "personalLoan") {
                $("input[name='peronalAmount']").removeAttr('readonly');
            }
        });
    });
});