keypress 이벤트를 사용하여 요소 추가하기

Question

저는 자바 스크립트를 배우는 중이며 교회의 탁아 서비스를위한 지불 계산기를 만들려고합니다. id "children"이있는 div에 div 클래스에 추가 할 클래스 "child"(그 안에있는 모든 내용)를 원합니다. 간단한 div가 키 누르기로 추가되었지만 세 번째를 추가하지는 않습니다. 둘 이상의 div를 추가하려면 어떻게해야합니까? div를 모든 'stuff'와 함께 추가하려면 어떻게해야합니까? 코드는 다음과 같습니다 :

<div id="input"> 
    <div id="children"> 
     <div class="child"> 
     <h2>Choose Child's Class</h2> 
     <select id="primary" class="selector"> 
      <option value=" ">Select Class</option> 
      <option value=200>Infants</option> 
      <option value=175>Wobblers</option> 
      <option value=175>Toddlers</option> 
      <option value=165>PreSchool 3's</option> 
      <option value=165>PreK 4's</option> 
      <option value=75>Schooler Before &amp; After</option> 
      <option value=40>Schooler Before Only</option> 
      <option value=65>Schooler After Only</option> 
      <option value=60>Schooler AFA Before &amp; After</option> 
      <option value=20>Schooler AFA Before Only</option> 
      <option value=30>Schooler AFA After Only</option> 
      <option value=40>Part Time</option> 
     </select> 
     </div><!--closes child class div--> 
    </div><!--closes children id dive--> 

    <h3> Press any key on your keyboard to add another child</h3> 

및 자바 스크립트 스타터 그래서

$(document).ready(function(){ 
    var $newChild=$('<div class="child">Testing</div>'); 
    $(document).keyup(function(){ 
     $newChild.appendTo($('#children')); 
    }); 
}); 

Answer 1

이 당신의 자바 스크립트 그래서 당신은 추가 할 수 있습니다 많은 div를 같이하는 방법입니다

$(document).ready(function(){ 
    $(document).on('keyup', function(){ 
     var $newChild=$('<div class="child">Testing</div>'); 
     $newChild.appendTo($('#children')); 
    }); 
}); 

또는

$(document).ready(function(){ 
    $(document).on('keyup', function(){ 
     var $newChild=$('<div class="child">Testing</div>'); 
     $('#children').append($newChild); 
    }); 
}); 

당신은 clarif해야합니다. y 질문의 나머지 부분은 왜 당신이 물건을 의미합니까?

$(document).ready(function() { 
    var childHtml = "<div class='child'>Child</div>"; 
    $(document).keyup(function() {   
     $('#children').append(childHtml); 
    }); 
}); 

jsFiddle :

Answer 2

귀하의 jQuery를 같은 것을 할 필요가 http://jsfiddle.net/ek922tz2/7/