Tengo este pequeño problema, la cuestión es que en la primera funciona y me da la url correcta pero luego cuando voy a otra me sigue dando la misma url de la primera... Lo que necesito es que en función de la url que haya yo pueda cambiar las clases para que a su vez se cambien los colores, si alguien tiene más experiencia y me pueda ayudar se lo agradecería muchísimo. Este es mi código:
$('a.enlacecategoria').ready(function () {
var url = $('a.enlacecategoria').attr('href');
var url_analizada = /^(\w+):\/\/([^\/]+)([^]+)$/.exec(url);
var [, protocolo, servidor, path] = url_analizada;
if ($path = '/ramblaprimmiche/Familia/administracio-i-gestio/') {
$('#barra-color').addClass('ninguna')
} else if ($path = '/ramblaprimmiche/Familia/electricitat-electronica/') {
$('#barra-color').removeClass('bg-blue');
$('#barra-color').addClass('bg-orange');
} else if ($path = '/ramblaprimmiche/Familia/educacio-i-control-ambiental/') {
$('#barra-color').removeClass('bg-blue');
$('#barra-color').addClass('bg-green-estudio');
} else if ($path = '/ramblaprimmiche/Familia/itineraris-formatius-especifics/') {
$('#barra-color').removeClass('bg-blue');
$('#barra-color').addClass('bg-red');
} else if ($path = '/ramblaprimmiche/Familia/programes-de-formacio-i-insercio/') {
$('#barra-color').removeClass('bg-blue');
$('#barra-color').addClass('bg-sky');
}
alert($path);
});
.bg-blue {
background-color: #46495C;
}
.bg-orange {
background-color: #a15838;
}
.bg-green-estudio {
background-color: #95aa45;
}
.bg-red {
background-color: #9b3f4c;
}
.bg-sky {
background-color: #5a95a5;
}
<div class="banner-box bg-burgundy color-custom-white text-left">
<div id="barra-color" class="bg-blue wrapper-left float-left h-100">
<h1 class="uppercase mb-0 invisible">a</h1>
</div>
<div class="header-cursos">
<h1 class="uppercase mb-0 mx-3 taxonomia-single" id="categoriaActual">
<?php echo get_the_term_list( $post->ID, 'Familia', '', ', ' ); ?></h1>
<h2 class="uppercase fs-15 mx-lg-0 mx-3"><?php the_title(); ?></h2>
</div>
</div>