JSFiddle - React, Tailwind, and code Playground

by Emre Erkan

HTML

<table id="grid">
    <thead>
        <tr>
            <th>th 1 <input type="text" /></th>
            <th>th 2 <input type="text" /></th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>td 1 <input type="text" /></td>
            <td>td 2 <input type="text" /></td>
        </tr>
        <tr>
            <td>td 3 <textarea rows="2" cols="10"></textarea></td>
            <td>td 4 <textarea rows="2" cols="10"></textarea></td>
        </tr>
        <tr>
            <td>td 5 <select><option>option 1</option></select></td>
            <td>td 6 <select><option>option 1</option></select></td>
        </tr>
    </tbody>
</table>

JavaScript

$("#grid td, #grid th").live('click', function(){
    $(this).css('background', '#ff0');
});
$('#grid td input, #grid th input, #grid td select, #grid th select, #grid td textarea, #grid th textarea').live('click focus', function(event) {
    event.stopPropagation();
});