CODEWITHSUNDEEP
javascripthtmlcss
Ramaanand
Ramaanand

Reputation: 39

Change icon on clicking using "toggle"

I have the same HTML, CSS and Javascript as here: How to close this menu after click Please let me know how to change the hamburger icon to a close (x) icon (without using rotation of the icon) after clicking and opening the topnav Nav bar. I tried what is posted here and failed (I did add and try out all that was mentioned there, including the <i id="click-spanish" class="fa fa-caret-down"></i> and <div id="spanish-examples"></div>): Change toggle icon on click

Upvotes: 1

Views: 934

Answers (1)

Paramesh Krishna
Paramesh Krishna

Reputation: 98

you can use a variable for class and use onclick function to toggle the variable

    let icon = true

    const changeIcon = () => {
    icon = !icon
    }

in html you can use like

    <i id="click-spanish" onclick="changeIcon()" class={icon ? "fa fa-caret-down":"some other icon"}> </i>

Upvotes: 1

Related Questions