Javascript innerHtml repeat

Question

innerHtml을 작성하고 있지만 div가 반복해서 반복됩니다. 나는 어떻게 풀어야할지 모른다. 도와 주셔서 감사합니다. 아래

내 코드 :

for(b=0; b<Object.keys(getCurrentAM).length; b++){ 

    var num = Object.keys(getCurrentAM)[b]; 
    var dutyData = getCurrentAM[num]; 

    var res = num.replace("A", "P"); 
    var newD2 = num.replace("A", ""); 

    var amDuty = document.getElementById('' + num + '_amDuty'); 
    var locationDuty = document.getElementById('' + num + '_locationDuty'); 
    var pmDuty = document.getElementById('' + res + '_pmDuty'); 

    amDuty.style.display = 'block'; 
    locationDuty.style.display = 'block'; 
    pmDuty.style.display = 'block'; 

    if ((amDuty.getElementsByTagName('na').length == 0) && (locationDuty.getElementsByTagName('na').length == 0) && (pmDuty.getElementsByTagName('na').length == 0)){   

     amDuty.innerHTML = '<div class="dutyChangeSize">'+ amDuty.innerHTML + '<br/>' + locationDuty.innerHTML + '<br/>' + pmDuty.innerHTML + '</div>'; 
     locationDuty.innerHTML = ''; 
     pmDuty.innerHTML = ''; 
    } 
} 

Answer 1

나는 클래스를 변경하고
의 반복 표시되지 CSS를 사용했습니다.

for(b=0; b<Object.keys(getCurrentAM).length; b++){ 

var num = Object.keys(getCurrentAM)[b]; 
var dutyData = getCurrentAM[num]; 

var res = num.replace("A", "P"); 
var newD2 = num.replace("A", ""); 

var amDuty = document.getElementById('' + num + '_amDuty'); 
var locationDuty = document.getElementById('' + num + '_locationDuty'); 
var pmDuty = document.getElementById('' + res + '_pmDuty'); 

amDuty.style.display = 'block'; 
locationDuty.style.display = 'block'; 
pmDuty.style.display = 'block'; 

if ((amDuty.getElementsByTagName('na').length == 0) && (locationDuty.getElementsByTagName('na').length == 0) && (pmDuty.getElementsByTagName('na').length == 0)){   

    amDuty.className = "dutyChangeSize"; 

    amDuty.innerHTML = ''+ amDuty.innerHTML + '<br/>' + locationDuty.innerHTML + '<br/>' + pmDuty.innerHTML + ''; 
    locationDuty.innerHTML = ''; 
    pmDuty.innerHTML = ''; 
} 
    } 

-> CSS

BR + BR {표시 : 없음}