How to switch like and dislike

Use CSS and JavaScript to switch between like/not favorite buttons.

Click on the icon to switch between like/dislike (favorite/not favorite):

Toggle (hide/display) an element

Step 1 - Add HTML:

<!-- Add icon library -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<!-- Use an element to switch between like/dislike icons -->
<i onclick="myFunction(this)" class="fa fa-thumbs-up"></i>

Step 2 - Add JavaScript:

function myFunction(x) {
  x.classList.toggle("fa-thumbs-down");
}

Try It Yourself