0
I’m having trouble individually opening each option on that list to show the corresponding information for each item
HTML
<ul class="lista">
<li class="item">
<strong>Item 1</strong>
<div class="texto">
<p>Descrição do item 1...</p>
</div>
</li>
<li class="item">
<strong>Item 2</strong>
<div class="texto">
<p>Descrição do item 2...</p>
</div>
</li>
<li class="item">
<strong>Item 3</strong>
<div class="texto">
<p>Descrição do item 3...</p>
</div>
</li>
</ul>
Javascript
$(document).ready(function(){
$('div.texto').hide() // ocultando a descrição dos itens
$('li.item').each(function(){ // percorrendo cada elemento da lista
this.click(function(){ // cada vez que clico em um elemento da lista é lançado uma função
$('div.texto').toggle() // o texto é mostrado ou ocultado novamente
})
})
})
I’m using the version of Jquery 3.2.1
PS: As far as I understand from the comments, my code is doing this, which information is missing so that the function actually runs correctly.
When handling the event
click
of the elementli.item
you do$('div.texto').toggle()
. How would jQuery know about which elementdiv.texto
should it act? How is a child element of the<li>
, then you can reduce your search of the elements to only child elements. You can search for the functionchildren
jQuery– Woss