My Simple HTML Structure:
<html>
<body>
<p id="5">
My Text Qoted Here -
<span class="author">Author </span>
<br>
<span class="uptext">20</span>
<img class="im" class="upimg"
src="http://bgathinktank.files.wordpress.com/2011/01/vote-button.jpg" />
<img class="im" class="downimg"
src="http://2.bp.blogspot.com/_XeuZ1yDnv4Q/TSUkAT6T1dI/AAAAAAAADR8/nPHP4JvVxy8/s1600/vote.jpg" />
<span class="downtext">5</span>
</p>
</body>
</html>
as can be seen there are two images, and i want to change the count of the image based on which image is clicked.
i write the following jquery code for it:
$(function() {
$(".upimg").click(function(e) {
e.preventDefault();
alert("here1");
curr_val = $(this).closest(".uptext").text();
nos = parseInt(curr_val, 10) + 1;
$(this).closest(".uptext").text(nos);
});
$(".downimg").click(function(e) {
e.preventDefault();
alert("here2");
curr_val = $(this).closest(".downtext").text();
nos = parseInt(curr_val, 10) + 1;
$(this).closest(".downtext").text(nos);
});
});
But it does not seem to respond.
You can find the fiddle here
Your
<img>tags have two class attributes:Try changing that to
Also, the
closest()method returns the closest parent element, not an adjacent sibling, so to find the correctuptextelement, you need to use: