title: React useState change icon from hamburger to close icon fas-fa-times
body: <p>This is my code: <a href="https://github.com/reouen/bikes/tree/main/src/components" rel="nofollow noreferrer">https://github.com/reouen/bikes/tree/main/src/components</a></p>
  <pre><code>&lt;i className={click ? 'fas fa-times' : 'fas fa-bars'}/&gt;
  </code></pre>
  <p>^ This above should change icon to fas fa-times together with useState below after clicking on it. Why it doesnt work?</p>
  <pre><code>import React, { useState } from 'react'
  import Button from './Button'
  import './Navbar.css'
  import Dropdown from './Dropdown'
  import { Link } from 'react-router-dom'
  
  function Navbar() {
      const {click, setClick} = useState(false)
      const handleClick = () =&gt; setClick(!click)
      
      return (
           &lt;nav className=&quot;Navbar&quot;&gt;
               &lt;Link to=&quot;/&quot; className=&quot;Navbar-logo&quot;&gt;
               EPIC
               &lt;/Link&gt;
               &lt;div className=&quot;menu-icon&quot;&gt;
               &lt;i className={click ? 'fas fa-times' : 'fas fa-bars'}/&gt;
  
               &lt;/div&gt;
               &lt;/nav&gt;   
          
      )
  }
  
  export default Navbar
  </code></pre>