jquery add new checkbox, when clicked the new checkbox, it happens nothing

I have three tables. They all contains some checkboxes. when a checkbox in the first table is checked, it will add some new checkboxs into the second table. But when I check a checkbox in the second table, it happens nothing. It seems that the checkbox event only observe the checkbox in the first table. Following is the episode of my js code.

function bindEvent4CheckboxArea() {
  $('input[type=checkbox]').change(function() {
    initController.initGlobalData(false);
    $('input[type=checkbox]').each(function() {
      if ($(this).is(':checked')) {
        if ($(this).attr('id').indexOf('trade') >= 0) {
          var tradeId = $(this).attr('id');
          var tradeIdByInt = tradeId.substring(6);
          globalVar.userSelectedTrade.push(tradeId);
          if (tradeIdByInt < 100) {
            globalVar.userSelectedFirstTrade.push(tradeIdByInt);
          } else if (tradeIdByInt < 10000) {
            globalVar.userSelectedSecondTrade.push(tradeIdByInt);
          }

        } else {
          globalVar.userSelectedIndex.push($(this).attr('id'));
        }
      }
    });
    //add new checkbox into the second table
    render.drawTradeInfoArea('#second_trade');
    // add new checkbox into the third table
    render.drawTradeInfoArea('#third_trade');

  });
}