leon2009sp,
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
.old{
cursor: pointer;
text-align: center;
background-image: url(http://javascript.ru/forum/images/smilies/smile.gif);
}
.new.old{
background-image: url(http://javascript.ru/forum/images/smilies/dance3.gif);
}
</style>
</head>
<body>
<table width="400" summary="" >
<thead>
<tr>
<th>Title 1</th>
<th>Title 2</th>
<th>Title 3</th>
</tr>
</thead>
<tbody>
<tr>
<td class="old">1</td>
<td>Cell 1.2</td>
<td>Cell 1.3</td>
</tr>
<tr>
<td>Cell 2.1</td>
<td>Cell 2.2</td>
<td class="old">Cell 2.3</td>
</tr>
</tbody>
</table>
<script>
window.addEventListener('DOMContentLoaded', function() {
[].forEach.call(document.querySelectorAll('.old'), function(item) {
item.addEventListener('click', function() {
item.classList.toggle('new')
});
});
});
</script>
</body>
</html>