喜欢喜欢功能AJAX

I have this jQuery AJAX Like Dislike Script

<script>
$(function(){ 
    var PostID = <?php echo $PostID;  ?>; 

    $('.like-btn').click(function(){
        $('.dislike-btn').removeClass('dislike-h');    
        $(this).addClass('like-h');
        $.ajax({
            type:"POST",
            url:"rate.php",
            data:'Action=LIKE&PostID='+PostID,
            success: function(){
            }
        });
    });
    $('.dislike-btn').click(function(){
        $('.like-btn').removeClass('like-h');
        $(this).addClass('dislike-h');
        $.ajax({
            type:"POST",
            url:"rate.php",
            data:'Action=DISLIKE&PostID='+PostID,
            success: function(){
            }
        });
    });
});
</script>

Now I want to transform this script to multi post Like Dislike System. How i can do this? HTML will look like this:

<a href="#" onclick="RateSystem(LIKE, 1)">Like</a>
<a href="#" onclick="RateSystem(DISLIKE, 1)">Dislike</a>

LIKE/DISLIKE will be action, 1 will be ID of post to like/dislike. Thanks

If you want more than one post per page you can do this:

function send(action, id)
{
    var opposite;

    opposite = action === 'like' ? 'dislike' : 'like';

    $('#' + opposite + '-' + id).removeClass(opposite + '-h');
    $('#' + action + '-' + id).addClass(action + '-h');

    $.ajax({
        type:"POST",
        url:"rate.php",
        data:'Action=' + action + '&PostID=' + id,
        success: function(){
        }
    });
}

Now you only need to attach the handlers properly ($PostID must be different for every post in a loop):

<a href="#"
    id="like-<?php echo $PostID; ?>"
    onclick="send('like', <?php echo $PostID; ?>)">Like</a>
<a href="#"
    id="disloke-"<?php echo $PostID; ?>"
    onclick="send('dislike', <?php echo $PostID; ?>)">Dislike</a>

That's just a layout of the code, there may be defects. It's pretty different from where we started, so only you can actually test it and see where it need refinement.

you can make something like this. Each post it is each div with postId and two controls inside (like and dislike buttons). When you click like - function will get post id and send with post to server. You must to check ajax part of function.

$(function () {
  $('.like').click(function () { likeFunction(this); });
  $('.dislike').click(function () { dislikeFunction(this);});
});


function likeFunction(caller) {
  var postId = caller.parentElement.getAttribute('postid');
  $.ajax({
      type: "POST",
      url: "rate.php",
      data: 'Action=LIKE&PostID=' + postId,
      success: function () {}
  });
}
function dislikeFunction(caller) {
  var postId = caller.parentElement.getAttribute('postid');
  $.ajax({
      type: "POST",
      url: "rate.php",
      data: 'Action=DISLIKE&PostID=' + postId,
      success: function () {}
  });
}

<div class="post" postid="10">
    <input type="button" class='like' value="LikeButton" /> </input>
    <input type="button" class='dislike' value="DislikeButton"> </input>
</div>

If you have some questions or need more help you can ask me :)