JSFiddle - React, Tailwind, and code Playground

by ChrisStanyon

HTML

<table border="0">
<tbody>
<tr>
<td>
    <input type="radio" value="Miami Beach" name="country" />
    <label><img class="clicker" alt="click me" src="" /></label>
</td>
<td>
    <input type="radio" value="Sri Lanka" name="country" />
    <label></label>
</td>
<td>
    <input type="radio" value="Marrakech" name="country" />
    <label></label>
</td>
</tr>
</tbody>
</table>

CSS

table { margin: 20px; }
table img { width: 100px; height 30px; border: 1px solid green; }
table td { padding: 10px; }

JavaScript

$('img.clicker').click(function(){
    alert( $(this).parents('table').find('input:radio:checked').val() );
});