Reputation: 17
I currently trying to change the color of the div when onclick the but fail , i using "postid" instead of using id and class cause it need to change the color of the div that onclick only
$(function () {
$('.like').click(function () { likeFunction(this); });
});
function likeFunction(caller) {
var postId = caller.parentElement.getAttribute('postid');
$.ajax({
type: "POST",
url: "rate.php",
data: 'Action=LIKE&PostID=' + postId,
success: function () {}
});
}
<div class="post" postid="10">
<input type="button" class='like' value="LikeButton" /> </input>
</div>
Upvotes: 0
Views: 149
Reputation: 23654
You can reference $(this)
in your likeFunction, and use a class to change the color.
$(function() {
$('.like').click(likeFunction);
});
function likeFunction() {
$(this).addClass('clicked')
var postId = $(this).parent().attr('postid');
$.ajax({
type: "POST",
url: "rate.php",
data: 'Action=LIKE&PostID=' + postId,
success: function() {}
});
}
.clicked {
background: #f00;
color: #fff;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="post" postid="10">
<input type="button" class='like' value="LikeButton" /> </input>
</div>
Upvotes: 1