Increase and decrease onclick like facebook like button

You can try this code. This does not save the “likes”. To have that you have to use some backend langauge like PHP and a database to store the information in.

$(document).ready(function () {
  $('a.button').click(function () {
  if ($(this).hasClass('clicked')) {
    $(this).find('span.number').html(parseInt($(this).find('span.number').html()) - 1);
  else {
    $(this).addClass("clicked");$(this).find('span.number').html(parseInt($(this).find('span.number').html()) + 1);
a.button {
  display: inline-block;
  background-color: #8b9dc3;
  padding: 4px 8px 4px 8px;
  border-radius: 3px;
  color: #3b5998;
  font-family: Arial;
  cursor: pointer;
  user-select: none;
a.button:hover {
  box-shadow: 0px 0px 3px grey;
a.button span.number {
  display: inline-block;
  margin-right: 5px;
  color: white;
<script src=""></script>
<a class="button"><span class="number">0</span><span class="label">Like</span></a>

Leave a Comment