Jack
Jack

Reputation: 17

Change color of attributes javascript

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

Answers (1)

Kinglish
Kinglish

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

Related Questions