<!DOCTYPE html>
<html lang="ja-JP">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,user-scalable=yes,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.5">
<title></title>
<link rel="stylesheet" href="css/ad.css" media="all" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script>
$(function(){
$("input[value='山']").click(function(){
$("td:contains('山')").css("background-color","#FF0000");
});
$("input[value='田']").click(function(){
$("td:has(span)").css("background-color","#0000FF");
});
});
</script>
</head>
<body>
<input type="button" value="山">
<input type="button" value="田">
<table border="1">
<tr>
<td>佐藤</td>
<td>鈴木</td>
<td>高橋</td>
<td><span>田中</span></td>
<td>渡辺</td>
</tr>
<tr>
<td>伊藤</td>
<td>山本</td>
<td>中村</td>
<td>小林</td>
<td>加藤</td>
</tr>
<tr>
<td><span>吉田</span></td>
<td><span>山田</span></td>
<td>佐々木</td>
<td>斎藤</td>
<td>山口</td>
</tr>
<tr>
<td>松本</td>
<td>井上</td>
<td>木村</td>
<td>林</td>
<td>清水</td>
</tr>
<tr>
<td>山崎</td>
<td><span>池田</span></td>
<td>阿部</td>
<td>橋本</td>
<td>山下</td>
</tr>
</table>
</body>
</html>