jQueryで上下左右で一つのラジオボタン

[DEMO] Radio Grid

html

	<table>
		<tr>
		    <th></th>
		    <th>1</th>
		    <th>2</th>
		    <th>3</th>
		</tr>
		<tr>
			<td>Twix</td>
			<td><input type="radio" name="row-1" data-col="1"></td>
			<td><input type="radio" name="row-1" data-col="2"></td>
			<td><input type="radio" name="row-1" data-col="3"></td>
		</tr>
		<tr>
			<td>Snickers</td>
			<td><input type="radio" name="row-2" data-col="1"></td>
			<td><input type="radio" name="row-2" data-col="2"></td>
			<td><input type="radio" name="row-2" data-col="3"></td>
		</tr>
		<tr>
		    <td>Butterfingers</td>
		    <td><input type="radio" name="row-3" data-col="1"></td>
		    <td><input type="radio" name="row-3" data-col="2"></td>
		    <td><input type="radio" name="row-3" data-col="3"></td>
		</tr>
	</table>

jQuery

	$(function() {
		var col, el;
		$("input[type=radio]").click(function() {
		   el = $(this);
		   col = el.data("col");
		   $("input[data-col=" + col + "]").prop("checked", false);
		   el.prop("checked", true);
		});
	});