jQuery addClass example

Change class name on click in jQuery

by fest1val

HTML

<div class="like__box">
  <div class="like"></div>
</div>

CSS

.like__box {
  background: #ccc;
}

.like {
  display: flex;
  align-items: center;
  justify-content: center;
  background: blue;
  width: 30px;
  height: 30px;
  color: #fff;
  text-align: center;
}

.like.Like_act {
  background: red;
}

JavaScript

$('.like').click(function() {
  var linc = $(this);
  var dit = linc.attr("data-id"); 
  var value = parseInt(linc.html());
  
  if(!value) value = 0;
  
  if($(this).hasClass('Like_act')) {
    linc.removeClass('Like_act').addClass('Like_bck');
    linc.html(value - 1);
  } else {
    linc.removeClass('Like_bck').addClass('Like_act');
    linc.html(value + 1);
  }
})