Estou com o seguinte código:
HTML:
<select class="form-control btn-form" id="select-category">
<option selected hidden>Selecione uma categoria:</option>
<option value="anu1">Anunciante1</option>
<option value="anu2">Anunciante/option>
<option value="anu3">Anunciante3</option>
</select>
JS:
$('#select-category').change(function(){
if($(this).val() == 'anu1'){
document.getElementById('alert-anu-1').style.display='block';
}
if($(this).val() == 'anu2'){
document.getElementById('alert-anu-2').style.display='block';
}
if($(this).val() == 'anu3'){
document.getElementById('alert-anu-3').style.display='block';
}
});
A ideia é ter uma lista e depois quando o usuário selecionar uma opção mostrar um "alert" em bootstrap. Ou seja, se o usuário selecionar o valor "anu1", mostra o alert "alert-anu-1", isso até então está funcionando. O que não estou conseguindo é limpar os valores.
Ex: se selecionar o valor anu1, mostra ele, mas se selecionar o valor anu2, tem que limpar o alert do anu1 e mostrar apenas o do anu2 e assim por diante.... Como poderia fazer isso?