javascript - How to access variable values from jstl foreach to jQuery -

hello guys may easy question m finding quite tricky. scenario m printing values database table using jstl foreach.

<c:foreach items="${pal}" var="p">     <tr>         <td><c:out value="${p.pid}"></c:out></td>         <td><c:out value="${p.pname}"></c:out></td>         <td><c:out value="${p.pdesc}"></c:out></td>         <td><c:out value="${p.pestd}"></c:out></td>         <td><a id="popa" href="#">allocate</a></td>     </tr> </c:foreach> 

and onclick allocate button want particular pid (i.e suppose there 1,2,3,...,10 pid when click on 4th should 4th pid value) in jquery.

but in jquery when try value got last value in loop whichever button click.

in jquery section

 $("a#popa").click(function(){       var input = $("<c:out value='${pid}' />");      alert(input);   }); 

and tried this

 <c:foreach var='lang' items='${paramvalues.pid}'>      <label><font color='#00cc00'><c:out value='${lang}'/></font></label>  </c:foreach>   nothing works 

please me , guide me how current value of pid on click in jquery.

the value of each id attribute should unique across entire dom. you're using id="popa" in loop, means there more one. when try select id jquery gives last one.

i consider using following approach. instead of using id, use data-* attribute.

<c:foreach items="${pal}" var="p">     <tr>     <td><c:out value="${p.pid}"></c:out></td>     <td><c:out value="${p.pname}"></c:out></td>     <td><c:out value="${p.pdesc}"></c:out></td>     <td><c:out value="${p.pestd}"></c:out></td>     <td><a data-pid="${p.pid}" href="#">allocate</a></td>     </tr> </c:foreach> 

then can wire click event this.

$("[data-pid]").click(function(){   var pid = $(this).data("pid");   alert(pid); });