Accordion with variable content
I’m trying to make an accordion with a "dynamic" content. here is an example with for loop:
<div > <% for(var k =0 ;k<5; k++){ %> <button class="accordion"><%=k%></button> <% for(var i=0;i<4;i++){ %> <div class="panel"> <p> i= <%=i%></p> </div> <%}%> <%}%> </div>
…………..
<style> .accordion { background-color: #eee; color: #444; cursor: pointer; padding: 18px; width: 100%; border: none; text-align: left; outline: none; font-size: 15px; transition: 0.4s; } .active, .accordion:hover { background-color: #ccc; } .panel { padding: 0 18px; display: none; background-color: white; overflow: hidden; } </style>
The result I get is displaying only i=0
. Ignoring the rest!
any idea what I’m missing here ? thanks in advance!