javascript - effect on jquery created dynamically tag -

javascript - effect on jquery created dynamically tag -

i have problem jquery. have xml file utilize load list of video information. on each element in xml need see effect jquery (fadetoggle etc).

the problem not work, show code

<script type="text/javascript"> $(document).ready(function(){ $.ajax({ type:"get", url:"menu.xml", datatype:"xml", success: function(xml){ $(xml).find("food").each(function(){ var nome = $(this).find('nome').text(); var ingredienti = $(this).find('ingredienti').text(); $("#listapizza").append("<li class=\"list\"><a class=\"acla\" href=\"#\">"+nome+"</a> <div class=\"divhide\" style=\"display:none\">("+ingredienti+")</div></li>"); }); }, error: function(request, error, tipo_errore) { alert(error+': '+ tipo_errore); } }); $(".acla").click(function(){ $(this).next().fadetoggle(1500); }); }); </script>

this container of list

<ul id="listapizza"> </ul>

i can not understand why not work

tnx

use event-delegation since dynamically appended.

$("#listapizza").on("click", ".acla", function(){ $(this).next().fadetoggle(1500); });

javascript jquery xml html5