I have multiple icons, I want to change my certain icon to another icon based on the ajax result. For example, when the res = true, my bookmark icon needs to change to fa fa-address-card icon. Now the code is when the res = true, both icon will change. Does anyone know how to solve it? Thanks in advance.

<i id="bookmark" ></i>
<i id="database" ></i>


$('i').removeClass('fa-bookmark');
$('i').addClass('fa fa-address-card');

CodePudding user response：

your second jquery line is causing the problem

in both jquery selectors you are selecting all i tags in your html,,

first one isn't causing any trouble because it HAS 'fa-bookmark' and others don't so it will remove bookmark icon class

but in the second one you are applying fa-address-card to all i elements and that's why other icons are getting changed

$('#bookmark').removeClass('fa-bookmark').addClass('fa-address-card');

this is a better approach and will solve your problem