classlist.toggle for font awesome - Javascript DOM

Javascript examples for DOM:Element classList

  1. HOME
  2. Javascript
  3. DOM
  4. Element classList

Description

classlist.toggle for font awesome

Demo Code

ResultView the demo in separate window 

<html>
   <head> 
      <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"> 
      <style>

.fa {/* w  w w .  j  a v  a  2  s  .  co m*/
   font-size: 50px;
   cursor: pointer;
   user-select: none;
}
.fa:hover {
   color: darkblue;
}

      </style> 
   </head> 
   <body> 
      <i onclick="myFunction(this)" class="fa fa-minus"></i> 
      <script>
function myFunction(x) {
    x.classList.toggle("fa-check");
    x.classList.toggle("fa-minus");
}

      </script>  
   </body>
</html>

Related Tutorials