jQuery - 코드를 반복하지 않고 HTML을 두 번 이상 추가 하시겠습니까?

Question

div에 여러 HTML을 여러 번 추가하려고합니다. 나는 그것에게 총 4 회를 추가 할 http://jsfiddle.net/9m1cfL4u/

,이 방법은 완벽하게 잘 작동하지만 같은 APPEND 모든 호출하는 것보다이 작업을 수행 할 수있는 정돈 방법이 여기있다 :

내가 현재 그것을하고있어 방법 시각? 그것은 나에게 지저분하고 "부적절한"것처럼 보입니다!

도움 주셔서 감사합니다.

$('.banner').append('<div class="content"></div>'); 
$('.banner').append('<div class="content"></div>'); 
$('.banner').append('<div class="content"></div>'); 
$('.banner').append('<div class="content"></div>'); 

Answer 1

for 루프 만 있으면 충분합니다.

Updated Example

jQuery를하지 않고

for (var i = 0; i < 4; i++) { 
    $('.banner').append('<div class="content"></div>'); 
} 

.. 그리고 : 같은 일을하고의

Example Here

var banner = document.querySelector('.banner'), 
    content; 

for (var i = 0; i < 4; i++) { 
    content = document.createElement('div'); 
    content.className += 'content'; 
    banner.appendChild(content); 
} 

Answer 2

그리고 약간의 장식적인 방법입니다.

$.fn.repeatTimes = function(times, cb) { 
 
     for(var time = 1;time <= times; time += 1) { 
 
     cb.call(this, time); 
 
     } 
 
     return this; 
 
    } 
 

 
    $(function(){ 
 
    
 
     $('.banner').repeatTimes(4, function(time) { 
 
      this.append('<div class="content">this is ' + time + ' time</div>'); 
 
     }); 
 
    });

<div class="banner"></div> 
 

 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>