Pavan K Pavan K - 4 months ago 20
Javascript Question

change icon on click with materializecss

I am using the floating action button for displaying a menu and have a save icon in the menu

<div id="menu" class="fixed-action-btn horizontal click-to-toggle" style="bottom: 85px; right: 18px;">
<a class="btn-floating btn-large red">
<i class="material-icons">menu</i>
</a>
<ul>
<li ><a href="#" class="btn-floating blue"><i id="save" class="material-icons">add</i></a></li>
</ul>
</div>


I would like to change the icon to
check
from
add
on click of the add button , if possible with an animation. How can I do this ? I am noob could someone point me in the right direction.

Answer

Do this in your onclick handler function, use id selector preferably, i just used class here,

$(".blue").html('<i id="save" class="material-icons">check</i>');