I have two buttons where I should press and show me three more buttons that are hidden plus one of the information on each button.
My idea is that when I open the section it shows me the content of the first button (Neighbor Service), and that it shows the content of undertaking.
Initially I can have the content hidden and as buttons are pressed, I activate them but what they asked me was that when you enter the section the "Service for Neighbors" button is active and that it shows the contents of the "Start" button only . How far it can go was that it showed all the content of all the buttons. How could I do it?
Arming HTML:
$(".button2").click(function() {
$(".button2").removeClass("activo");
$(this).addClass("activo");
$(".descripcion .art").hide();
var indice_seccion = $(".button2").index($(this));
$(".descripcion .art").eq(indice_seccion).show();
return false;
});
$(".descripcion .art").show();
$(".button").click(function() {
$(".button").removeClass("activo");
$(this).addClass("activo");
$(".btn .menu2").hide();
var indice_seccion = $(".button").index($(this));
$(".btn .menu2").eq(indice_seccion).show();
return false;
});
$(".btn .menu2").eq(0).show();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="" title="" class="button">Servicio para Vecinos</a>
<a href="" title="" class="button">Servicio para Empresas</a>
<section class="btn">
<article class="menu2">
<a href="" title="" class="button2">EMPRENDER</a>
<a href="" title="" class="button2">AHORRO</a>
<a href="" title="" class="button2">EMPLEO</a>
<section class="descripcion">
<article id="ver" class="art muestra">
aqui va el texto
</article>
</section>
<section class="descripcion">
<article id="ver" class="art muestra">
aqui va el 2 texto
</article>
</section>
<section class="descripcion">
<article id="ver" class="art muestra">
aqui va 3 texto
</article>
</section>
</article>
</section>