Slide com javascript não esta dando certo os links

Não estou conseguindo fazer funcionar os links nas imagens nesse slide quando faz a mudança, todas as imagens pega somente o ultimo link alguém pode me ajudar

<style>
 * {margin: 0; padding: 0;}
 a,img {border: none;}
 .trs {-webkit-transition:all ease-out 0.5s;
 -moz-transition:all ease-out 0.5s;
 -o-transition:all ease-out 0.5s;
 -ms-transition:all ease-out 0.5s;
 transition:all ease-out 0.5s;}

 #slider {position: relative; z-index: 1;}
 #slider a { position: absolute; top: 0; left: 0; opacity: 0;filter:alpha(opacity=0);}
 .ativo {opacity: 1!important; filter:alpha(opacity=100)!important;}

 /*controladores*/
 span {background: #000; cursor: pointer; opacity: 0;filter:alpha(opacity=0); position: absolute; bottom: 40%; width: 43px; height: 43px; z-index: 5;}
 .next {right: 10px;}
 .next:before,.next:after {left: 21px;}
 .next:before {
 -webkit-transform: rotate(-42deg);
 top: 5px;
 }
 .next:after {
 -webkit-transform: rotate(-132deg);
 top: 19px;
 }
 .next:before,.next:after,.prev:before,.prev:after {content: "";
 height: 20px;
 background: #fff;
 width: 1px;
 position: absolute;
 }
 .prev {left: 10px;}
 .prev:before,.prev:after {left: 18px;}
 .prev:before {
 -webkit-transform: rotate(42deg);
 top: 5px;
 }
 .prev:after {
 -webkit-transform: rotate(132deg);
 top: 19px;
 }
 figure:hover span {opacity: 0.76;filter:alpha(opacity=76);}
 figure {
 max-width: 640px;
 height: 350px;
 position: relative;
 overflow: hidden;
 margin: 0px auto;
 }
 figcaption {padding-left: 3px;color: #fff; font-family: "Kaushan Script","Lato","arial"; font-size: 20px; background: rgba(0, 0, 0, 0.76); width: 640px; position: absolute; bottom: 0; left: 0; height: 55px; z-index: 5}
	</style>
<?php
require 'conexaocompdo.php';
 try {
 $result = $db->prepare("SELECT id_noticias, cidade_noticia, foto_capa, titulo_noticias, redacao_noticias from `tbl_noticias` where tipo_noticias <> 'Notícias Geral' order by id_noticias desc limit 4");
 $result->execute();
 }
 catch(PDOException $error) {
 echo "Erro ao selecionar a tabela eventos: ".$error->getMessage();
 }
 $i=0;
 while($linha = $result->fetch(PDO::FETCH_ASSOC)) {
 $id_noticias[]=(int)$linha['id_noticias'];
 $cidade_noticia[]=$linha['cidade_noticia'];
 $titulo_noticia[] = stripslashes($linha['titulo_noticias']);
 $redacao_noticias[] = $linha['redacao_noticias'];
 if ($linha['foto_capa'] == "") {
 $imagem[] = "imagens190/logoprincipal.jpg";
 }
 else {
 $imagem[] = $linha['foto_capa'];
 }
 }
?>
	<figure>
 <span class="trs next"></span>
 <span class="trs prev"></span>

 <div id="slider">
 <a href="noticia-completa.php?id_noticias=1463" class="trs"><img src="<?php echo $imagem[0];?>" alt="<?php echo $cidade_noticia[0].' - '.$titulo_noticia[0];?>" width="640px" height="350px"/></a>
 <a href="noticia-completa.php?id_noticias=1462" class="trs"><img src="<?php echo $imagem[1];?>" alt="<?php echo $cidade_noticia[1].' - '.$titulo_noticia[1];?>" width="640px" height="350px"/></a>
 <a href="noticia-completa.php?id_noticias=1461" class="trs"><img src="<?php echo $imagem[2];?>" alt="<?php echo $cidade_noticia[2].' - '.$titulo_noticia[2];?>" width="640px" height="350px"/></a>
 <a href="noticia-completa.php?id_noticias=1460" alt="<?php echo $cidade_noticia[3].' - '.$titulo_noticia[3];?>" width="640px" height="350px"/></a>
 </div>

 <figcaption></figcaption>
	</figure>

	<script type="text/javascript">
 function setaImagem(){
 var settings = {
 primeiraImg: function(){
 elemento = document.querySelector("#slider a:first-child");
 elemento.classList.add("ativo");
 this.legenda(elemento);
 },
 slide: function(){
 elemento = document.querySelector(".ativo");
 if(elemento.nextElementSibling){
 elemento.nextElementSibling.classList.add("ativo");
 settings.legenda(elemento.nextElementSibling);
 elemento.classList.remove("ativo");
 }else{
 elemento.classList.remove("ativo");
 settings.primeiraImg();
 }
 },
 proximo: function(){
 clearInterval(intervalo);
 elemento = document.querySelector(".ativo");

 if(elemento.nextElementSibling){
 elemento.nextElementSibling.classList.add("ativo");
 settings.legenda(elemento.nextElementSibling);
 elemento.classList.remove("ativo");
 }else{
 elemento.classList.remove("ativo");
 settings.primeiraImg();
 }
 intervalo = setInterval(settings.slide,4000);
 },
 anterior: function(){
 clearInterval(intervalo);
 elemento = document.querySelector(".ativo");

 if(elemento.previousElementSibling){
 elemento.previousElementSibling.classList.add("ativo");
 settings.legenda(elemento.previousElementSibling);
 elemento.classList.remove("ativo");
 }else{
 elemento.classList.remove("ativo");
 elemento = document.querySelector("a:last-child");
 elemento.classList.add("ativo");
 this.legenda(elemento);
 }
 intervalo = setInterval(settings.slide,4000);
 },
 legenda: function(obj){
 var legenda = obj.querySelector("img").getAttribute("alt");
 document.querySelector("figcaption").innerHTML = legenda;
 }
 }
 //chama o slide
 settings.primeiraImg();
 //chama a legenda
 settings.legenda(elemento);
 //chama o slide à um determinado tempo
 var intervalo = setInterval(settings.slide,4000);
 document.querySelector(".next").addEventListener("click",settings.proximo,false);
 document.querySelector(".prev").addEventListener("click",settings.anterior,false);
 }
 window.addEventListener("load",setaImagem,false);
	</script>