JQuery가 DOM을 사용하여 생성 된 요소에 액세스 할 수 없습니다.

Question

안녕하세요! 이 코드는 테이블을 표시하고 작동합니다. 테이블과 그 내용을 표시 할 수 있습니다. 여기 코드는 다음과 같습니다

 if(xhr.readyState == 4 && xhr.status == 200) { 
     var data = JSON.parse(xhr.responseText); 
     var x = 0; 
     var table = document.getElementById("tblData"); 

     for(x=0; x<data.length; x++) { 

      dataInstance = data[x].split('*'); 

      var row = document.createElement("tr"); 
      var td1 = document.createElement("td"); 
      var td2 = document.createElement("td"); 
      var td3 = document.createElement("td"); 
      var td4 = document.createElement("td"); 
      var td5 = document.createElement("td"); 
      var td6 = document.createElement("td"); 
      var td7 = document.createElement("td");; 

      var cb = document.createElement('input'); 
      cb.setAttribute("type", "checkbox"); 

      var tn1 = document.createTextNode(dataInstance[1]); 
      var tn2 = document.createTextNode(dataInstance[2]); 
      var tn3 = document.createTextNode(dataInstance[3]); 
      var tn4 = document.createTextNode(dataInstance[4]); 
      var tn5 = document.createTextNode(dataInstance[5]); 
      var tn6 = document.createTextNode(dataInstance[6]); 

      td1.appendChild(cb); 
      td2.appendChild(tn1); 
      td3.appendChild(tn2); 
      td4.appendChild(tn3); 
      td5.appendChild(tn4); 
      td6.appendChild(tn5); 
      td7.appendChild(tn6); 

      row.appendChild(td1); 
      row.appendChild(td2); 
      row.appendChild(td3); 
      row.appendChild(td4); 
      row.appendChild(td5); 
      row.appendChild(td6); 
      row.appendChild(td7); 

      table.appendChild(row); 
     } 
    } 

그러나이 후, 내가 jQuery를 사용하여 내 테이블에 번갈아 몇 가지 색상을 넣어하려고 할 때, 그것은 DOM을 사용하여 생성 된 행을 찾을 수 없습니다. 내 HTML 코드에있는 테이블의 표 머리글 만 색으로 채 웁니다. JQuery 코드입니다.

$("#tblData tr:even").css("background-color", "pink"); 
$("#tblData tr:odd").css("background-color", "yellow"); 

도와 주시겠습니까? 미리 감사드립니다. 어떤 도움을 주셔서 감사합니다!

Answer 1

내 질문에 대한 대답은 요소를 만든 후 JQuery 코드를 실행하는 것입니다.