<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<link rel="stylesheet" type="text/css" >
</head>
<body>
<h1>수영 시합</h1>
<button type="button" id="woman">여성부</button>
<button type="button" id="man">남성부</button>
<br><br>
<table border="1">
<tr>
<th>title</th>
<th>name</th>
<th>time</th>
</tr>
<tr>
<th>우승</th>
<td></td>
<td></td>
</tr>
<tr>
<th>2위</th>
<td></td>
<td></td>
</tr>
<tr>
<th>3위</th>
<td></td>
<td></td>
</tr>
</table>
<script type="text/javascript">
let woman = [
["",""],
["김영희","01:06:11"],
["성춘향","01:07:23"],
["박진희","01:12:34"]
];
let man = [
["",""],
["홍길동","01:07:11"],
["일지매","01:17:26"],
["정수동","01:17:22"]
];
$(function () {//table setter
// $("tr:eq(1) td:eq(0)").html('데이터');
$("#woman").click(function() {
for (i = 0; i < 4; i++) {
for (j = 0; j < 2; j++) {
$("tr:eq("+i+") td:eq("+j+")").html(woman[i][j]);
}
}
});
$("#man").click(function() {
for (i = 0; i < 4; i++) {
for (j = 0; j < 2; j++) {
$("tr:eq("+i+") td:eq("+j+")").html(man[i][j]);
}
}
});
});
</script>
</body>
