bonjour à tous;

j'ai un petit soucis avec une liste :

Voici la structure de cette liste qui est générée via mysql :

Code html : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<ul class="liste">
 <li class="LiTypeC">
   <h2>  Type A</h2>
    <p> Un enreg de ce type</p>
    <p> Un enreg de ce type</p>
    <p> Un enreg de ce type</p>
</li>
 <li class="LiTypeC">
    <h2>  Type B</h2>
    <p> Un enreg de ce type</p>
</li>
<li class="LiTypeC">
   <h2>  Type B</h2>
    <p> Un enreg de ce type</p>
 
</li>
</ul>

ici le css
Code css : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
.liste
{
list-style:none;
font-family:arial;
font-size:18px;
margin :0 auto;
padding : 0 ;
width:700px;
 
}
 
.liste li
{
position : relative;
border-bottom:1px solid grey;
cursor : pointer;
 
}
 
.liste h2
{
font-size: 22px;
 
}
 
.liste p
{
display :none;
font-size : 16px;
 
}
 
.liste span
{
position: absolute;
right: 5px;
top:0px;
 
}
 
.liste img
 
{
 
width:45px;
height:30px; 
}
 
 
.LiTypeC
{
position : relative;
border-bottom:1px solid grey;
cursor : pointer;
 
 
}

l’élément <p> est en display : noneet par l'action d'un Click sur un des élément <li> je veux faire apparaître le contenu.

donc voici le Jquery affecté

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
$(document).ready(function() 
 {
 
   $('.LiTypeC').click(function()
   {
 
 		$(this).children('p').each(function () {
 
 
          $(this).slideDown('500');
 
      });
   });
 
 });

je cherche à faire apparaître les balises <p>du <li>sur lequel je Click.
le problème de ce code est que je ne vois que le premier <p> d'un <li>
(pour l'exemple du premier <li> contenant 3 <p>.


Any Advice ?