Dynamically creating JavaScript function which will hide and display the div in JSP page

Question

My JSP code is

<c:forEach var="batchException" items="${batchExceptionType}">
<button> ${batchException.key}</button>
<div id="${batchException.key}">
...
</div>
</c:forEach>

batchExceptionType is a Map which is coming from Java Code using JSTL.

I want to hide and display the div on the button click.

As number of div created is not fixed. So I am not sure how to create JavaScript functions to hide and display this div

Thanks in advance.

Answer 1

try this

<c:forEach var="batchException" items="${batchExceptionType}">
<button onclick="hideShowDiv(${batchException.key})"> ${batchException.key}</button>
<div id="${batchException.key}">
...
</div>
</c:forEach>

and then in script

<script>
   function hideShowDiv(divId){
      $(#divId).toggle();
   }

</script>