Estou trabalhando com um mapa do Brasil em SVG, e preciso que quando clicar em um estado, ele adicione a classe "active" e remova a classe "active" dos outros. Também tem a função de adicionar o nome do estado em um input.
Exemplo:
<path id="Santa Catarina" class="BR-SC RegiaoSul str1" d="M101205 160059l0 -33 -32 -32 32" />
<script type="text/javascript">
$(docutment).ready(function() {
$(".str1").click(function(){
var state = $(this).attr("id");
$(".str1").removeClass("active");
$(this).addClass("active");
$("input[name=estado]").val( state );
});
});
</script>
Com jQuery não funciona é claro, gostaria de fazer isso em javascript, alguém pode me ajudar?