title: Toggle font awesome class on button click
body: <p>I have the code as here in this <a href="https://jsfiddle.net/dragenox/0n1n9o9n/1/" rel="noreferrer">jsfiddle</a>, I want the font awesome icon to change on button click using javascript, but it does'nt seem to work. I'm new to javascript so please forgive me if this was a dumb question.</p>
  
  <p>HTML</p>
  
  <pre><code>&lt;button id="favBtn" onclick="fav();"&gt;
      &lt;i id="favIcon" class="fa fa-star-o"&gt;&lt;/i&gt;&amp;nbsp;Favourite
  &lt;/button&gt;
  </code></pre>
  
  <p>Javascript</p>
  
  <pre><code>function fav() {
      document.getElementById("favIcon").toggleClass('fa-star-o fa-star');
  }
  </code></pre>