Lo primero es que cada enlace y texto que deseas mostrar estén dentro de un mismo contenedor.
Código HTML:
Ver original <a href="#" class="alternar-texto">
<div class="texto">Texto 1...
</div> <a href="#" class="alternar-texto">
<div class="texto">Texto 2...
</div>
De esta forma, puedes acceder al "padre" usando .closest() y, a partir de ahí, buscar el texto a mostrar.
Lo adecuado es asignar evento "click" a cada enlace y dentro:
- $(this) hace referencia al enlace que recibió el clic
- .closest('div') recorre el DOM hacia arriba hasta encontrar el contenedor padre
- find('.texto') busca en el padre el elemento con clase "texto"
- toggle() es la función de jQuery para mostrar y ocultar un elemento
Código Javascript
:
Ver original$(document).ready(function() {
$('.alternar-texto').on('click', function(e) {
$(this).closest('div').find('.texto').toggle();
});
});