So ändern Sie img per Klick mit jQuery - jquery, html, image

Ich habe diesen Code, der kleine Bilder in einer Tabelle anzeigt

<table>
<tr>
<td class="change" id="c1"><img src="/images/images/on.gif"/></td>
<td class="change" id="c2"><img src="/images/images/on.gif"/></td>
<td class="change" id="c3"><img src="/images/images/on.gif"/></td>
<td class="change" id="c4"><img src="/images/images/on.gif"/></td>
<td></td>
</tr>
</table>

Wie kann ich das Bild eines der Bilder in der Tabelle bei Klick ändern? Ich habe versucht, dies zu tun, kann aber nicht scheinen, es zum Laufen zu bringen.

$(document).on("click", ".change", function() {
if (this.src == "images/on.gif")
this.src = "images/off.gif";
else
this.src = "images/on.gif";
});

Ich habe danach gesucht und ja, ich habe ähnliche Fragen gefunden, aber ich kann nicht wirklich scheinen, es zum Laufen zu bringen.

Antworten:

.change ist nicht das Bild, es ist das übergeordnete TD:

$(function() {
$(document).on("click", ".change", function () {
var img = $(this).find("img");
img.attr("src", (img.attr("src") == "images/on.gif" ? "images/off.gif" : "images/on.gif"));
});
});

.change sind die Tabellenzellenelemente, nicht die Bildelemente

$(document).on("click", ".change img", function () {