Изменение цветных значков с jquery

Question

в моем проекте У меня есть возможность изменить цветовую схему всего макета, нажав кнопку цвета. Существует три типа цветов. У меня есть только одна проблема - проблема с иконками. По умолчанию они красные, и, щелкнув указанные кнопки, они должны повернуть точный цвет кнопки. Конечно, я могу все это сделать, вручную меняя каждый значок на каждый цвет в зависимости от события. Но это адский код и абсолютно не работает. Я вижу, как это должно работать так. У меня есть три папки для каждого цвета. В каждой папке есть цветные значки с тем же именем. Таким образом, нажав кнопку цвета, мне нужно изменить имя папки в моем «src». Вот некоторые строки моего кода:

<div id="color-selector-box"> 
     <div id="red" class="color-button" color-name="#d94d4b" src="img-v4/dl-button-red.png"></div> 
     <div id="green" class="color-button" color-name="#86aa66" src="img-v4/dl-button-green.png"></div> 
     <div id="blue" class="color-button" color-name="#4ab1d0" src="img-v4/dl-button-blue.png"></div> 
    </div> 

$('.bg-color-button').click(function(){ 
    pickedBackground = $(this).attr('color-background'); 
    var mildBackground = $(this).attr('mild-color'); 
    var bgType = $(this).attr('bg'); 

    $('.termine-box').attr('style', 'background:' + pickedBackground+ '!important'); 
    $('#mobile-navigation-bar').css('background', pickedBackground); 
    $('.strong').css('background', pickedBackground); 
    $('.mild').css('background', mildBackground); 
    if(bgType == 'light') { 
     $('.strong, .mild, .impressum a, #mobile-navigation-bar a, #navigation-bar a, .menu-bar, .termine-inside h1, .date-area').css('color', '#1b1b1b'); 
    } else { 
     $('.strong, .mild, .impressum a, #mobile-navigation-bar a, #navigation-bar a, .menu-bar, .termine-inside h1, .date-area').css('color', '#ffffff'); 
    } 
}); 

Answer 1

Надеюсь, что вы выглядите примерно так. вы можете заменить newsrc своим новым путем.

$('.color-button').click(function(){ 
    $(this).attr('src','newsrc') 
}) 

Answer 2

Так что я нашел решение, которое искал. Вот код, который я искал для тех, кто ищет такое же решение.

$('.tab-img img').each(function(){ 
      var $this = $(this) 
      $this.attr('src',$this.attr('src').replace('dark-grey-icons','grey-icons')); 
     })