JQuery заменить атрибут класса

Question

Как я могу изменить значение класса, чтобы быть другое значение:

Вот HTML:

<div class="example_infobox"> 
    <div class="col-md-3 col-sm-6 col-xs-12"> 
    <div class="info-box"> 
     <span class="info-box-icon bg-aqua"><i class="fa fa-envelope-o"></i></span> 
     <div class="info-box-content"> 
     <span class="info-box-text">Messages</span> 
     <span class="info-box-number">1,410</span> 
     </div><!-- /.info-box-content --> 
    </div><!-- /.info-box --> 
    </div><!-- /.col --> 
</div> 

Вот код JQuery:

$('.example_infobox .info-box-icon.bg-aqua').attr('class', 'info-box-icon ' + 'bg-green'); 

Вышеуказанный код jQuery изменяется:

<span class="info-box-icon bg-aqua"> 

к:

<span class="info-box-icon bg-green"> 

Приведенный выше код работает, но можно написать JQuery код, чтобы изменить класс, просто заменив bg-aqua с bg-green без указания весь класс (как я сделал в моем коде JQuery)? Под этим я подразумеваю, можно ли заменить часть класса новым значением, аналогичным string.replace в C#?

Благодаря

Answer 1

Вы можете использовать $.fn.toggleClass()

Используйте

$('.example_infobox .info-box-icon.bg-aqua').toggleClass('bg-aqua bg-green'); 

ИЛИ, Комбинация $.fn.removeClass() и $.fn.addClass()

$('.example_infobox .info-box-icon.bg-aqua').removeClass('bg-aqua').addClass('bg-green'); 

Answer 2

$('.example_infobox-icon').removeClass('bg-aqua').addClass('bg-green') 

Answer 3

Вы можете сначала проверить, какой класс существует в нем по .hasClass() '. Затем вы можете применить добавление и удаление таких классов:

if($('.example_infobox .info-box-icon.bg-aqua').hasClass('bg-green')) 
{ 
    $('.example_infobox-icon').removeClass('bg-green').addClass('bg-aqua'); 
} 
else 
{ 
    $('.example_infobox-icon').removeClass('bg-aqua').addClass('bg-green'); 
}