document.querySelector('.price').addEventListener('click',function (){
products.sort(function (a,b){
return a.price-b.price
})
document.getElementsByClassName('row')[0].innerHTML=''
products.forEach(function (a,i){
var card =
`<div class="col-sm-4">
<img src="https://via.placeholder.com/600" class="w-100">
<h5>${a.title}</h5>
<p>가격: ${a.price}</p>
</div>`;
document.getElementsByClassName('row')[0].insertAdjacentHTML('afterend', card)
})
})
이렇게 입력했는데 innerhtml공백처리는 안되고 insertAdjacentHTML만 실행되어 가격정렬버튼을 누르면 카드만 계속생성되요