javascript - 切换类可以与 js 生成的 html 一起使用吗？

Question

我正在使用 ajax 数据生成 html 内容。这是我的代码:

$('.expand').click(function(){$(this).toggleClass('open')});


function Get_id(){
  $.ajax({
    url: "here is my url with api_key",
    datatype: "json",
    method: "GET", // Что бы воспользоваться POST методом, меняем данную строку на POST   
    success: displayJson
  });
}
Get_id();


function displayJson(jsonData){
    let result='';
    console.log(jsonData['applications']);
     for (let i in jsonData["applications"]) {
     let goods ='<ul class=goods-container>'
     for(let j in jsonData["applications"][i]["goods"]){
        goods +='<li class="good">'+jsonData["applications"][i]["goods"][j].name+'</li>';
     }
      let endtime = '';
      let o_num = '';
      endtime += '<p>'+jsonData["applications"][i]["planDeliveryPeriod"].endDate.slice(11, 16)+'</p>';

      goods += '</ul>';

      result += '<div class=order-container><p>'+jsonData["applications"][i]["customId"]+'</p>'+endtime+'<div class="expand"></div></div>';

      $(".output").html(result);
    }
    setTimeout(Get_id, 30000);
}

所以，toggleclass 在这里不起作用，但如果我有这个没有 js 的 html 结构，它就可以。那么我在 javascript 中生成 html 时遇到问题了吗？

Answer 1

像这样更改第一行:

$('body').on('click', '.expand', function() {
        $(this).toggleClass('open')}
});