39128862

Node js and jQuery/Ajax (Like/Unlike)

HTML

<button class="unmarked">
  Originally unmarked
</button>

CSS

.marked {
  background-color: lightgreen;
}

.unmarked {
  background-color: lightblue;
}

JavaScript

$('button.unmarked').on('click', function(e) {
  var $targetButton = $(e.target);
  if ($targetButton.hasClass('marked')) {
  	onMarkedButtonClick($targetButton);
  } else if ($targetButton.hasClass('unmarked')) {
  	onUnmarkedButtonClick($targetButton);
  }
});

function onMarkedButtonClick($button) {
  $button.removeClass('marked');
  $button.addClass('unmarked');
}

function onUnmarkedButtonClick($button) {
  $button.removeClass('unmarked');
  $button.addClass('marked');
}