[jquery] DOM에 나중에 추가된 항목 접근(이벤트)

document가 모두 다 load 되고 난 후, jquery로 인해 DOM에 추가된 요소들은 보통 접근할 수 없다.

그것에 접근하기 위해서는 이벤트를 다르게 줘야 하는데

<div class="survey_list">
<div class="dis_table">
<input type="text"placeholder="항목 입력">
<a href="#" class="btn_del">삭제</a>
</div>
</div>

$('.survey_list').on('click', '.btn_del', function() {

$(this).parent().remove(); //여기서 this는 .btn_del 이 됨.

})

'.btn_del'이 DOM에 새로 추가된 엘리먼트라고 한다면,  그 부모를 이벤트 대상으로 선택하고

.on(event, 추가된 elment, function() { }) 로 작성을 하면 된다.

또는 ajax 호출 후에 추가해야하는 이벤트의 경우 아래 방법을 사용하면 잘됨.

$(window).bind("load", function() { 
     // insert your code here 
});

There is once more way which i'm using to increase the page load time.

$(document).ready(function() { 
  $(window).load(function() { 
     //insert all your ajax callback code here. 
     //Which will run only after page is fully loaded in background.
  });
});