JQuery Find and replace within a div

Question

I am trying to replace all font awesome icon within a certain div.

Here is my code:

$( '#icons' ).find( '.fa' ).each( function() {
  if( $( this ).hasClass( 'fa-adjust' ) ){
    $( this ).attr( 'class' , 'fa fa-circle' );
  } else if( $( this ).hasClass( 'fa-circle' ) ){
    $( this ).attr( 'class' , 'fa fa-adjust' );
  }
});

What I would like to do is swap fa-adjust with fa-circle within the div icons.

it is not swapping the classes. i forgot to mention, that the classes could be several div's below icons... does this matter? — user1822391
– user1822391, Commented Nov 30, 2014 at 13:15

u_mulder · Accepted Answer · 2014-11-30 13:01:20Z

1

Use toggleClass function. It can toggle several classes:

$( '#icons' ).find( '.fa' ).toggleClass('fa-adjust fa-circle');

answered Nov 30, 2014 at 13:01

u_mulder

54.8k5 gold badges54 silver badges72 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Amit Joki · Accepted Answer · 2014-11-30 12:58:04Z

0

Just do it straight away, as you can't have duplicate ids. Is icons a class?

$('.fa-adjust').removeClass("fa-adjust").addClass("fa-circle");

answered Nov 30, 2014 at 12:58

Amit Joki

59.4k7 gold badges80 silver badges96 bronze badges

1 Comment

user1822391 Over a year ago

No, icons is a div so I want to swap all of the fa-adjust and fa-circle within the div icons.

Leo · Accepted Answer · 2014-11-30 13:04:55Z

0

$('#icons').find('.fa.fa-adjust, .fa.fa-circle').toggleClass('fa-adjust fa-circle');

But why do you have to do it with JS rather than modify the markup?

edited Nov 30, 2014 at 13:04

answered Nov 30, 2014 at 12:59

Leo

13.9k5 gold badges47 silver badges64 bronze badges

2 Comments

user1822391 Over a year ago

I am getting the updates from an ajax call and would like to change the icon to reflect the refreshed states.

Leo Over a year ago

Got it. You don't have to call each because toggleClass will perform a so-called implicit iteration - jQuery automatically iterates over all the elements in a selection.

Collectives™ on Stack Overflow

JQuery Find and replace within a div

3 Answers 3

Comments

1 Comment

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related