JSFiddle - React, Tailwind, and code Playground
HTML
<table>
<tr>
<td>
<input type="radio" name="vehicle" value="company_vehicle" />Company Vehicle</td>
</tr>
<tr class="set_width" id="company_vehicle">
<td>
<input type="text" />
</td>
<td>
<input type="checkbox" />Company Vehicle</td>
</tr>
<tr>
<td>
<input type="radio" name="vehicle" value="hiring_vehicle" />Hiring Vehicle</td>
</tr>
<tr class="set_width" id="hiring_vehicle">
<td>
<input type="text" />
</td>
<td>
<input type="radio" name="abc" value="car" />Car</td>
<td>
<input type="radio" name="abc" value="bus" />Bus</td>
</tr>
<tr>
<td>
<input type="radio" name="vehicle" value="taxi" />Taxi</td>
</tr>
<tr class="set_width" id="taxi">
<td>
<input type="checkbox" />Taxi</td>
</tr>
</table>
CSS
.readOnly{
background-color: #F6F6F6;
}
JavaScript
var rbt_vehicle = $("input[name=vehicle]");
$(rbt_vehicle).on('change', function (e) {
var optionSelected = $("option:checked", this);
var valueSelected = this.value;
//alert(valueSelected);
$("#" + valueSelected).find('input[type="text"]').val('').addClass("readOnly").attr('disabled', true);
$("#" + valueSelected).find(':checkbox,:radio').prop('checked', false).addClass("readOnly").attr('disabled', true);
});