Ajax 2 : 상품 더보기 버튼만들기

[익명]

1) javascript 2) jquery 
-> 둘다 연습해보고있어서 그냥 두개다 해보는 중입니다 

동작은 잘되지만 코드축약을 하면 실행이 안되서 ㅠ 문의글 남겨요 
템플릿 함수를 따로 빼면 실행이 안되는데.... (변수도 바꿔봤는데.. 뭐가 문제인지 모르겠어요 .. )
어떻게 축약하면 좋을까요 
forEach가 전부 반복되는것 같아서 통째로 빼보기도 했는데 몇시간째 실행이 너무 안되서 ㅠ 
문의글 남깁니다 ㅠㅠ 도와주세요.. .

products.forEach(function(a,i){
var 템플릿 = `<div class="col-sm-4">
 < img src="https://via.placeholder.com/600" class="w-100">
 <h5>${a.title}</h5>
 <p>가격 : ${a.title}</p>
 </div>`;
document.querySelector('.row').insertAdjacentHTML('beforeend',템플릿);
})

document.getElementById('more').addEventListener('click', function(){
count ++; 
if (count == 1){
$.get('https://codingapple1.github.io/js/more1.json').done(function(data){
data.forEach((b,i)=>{
var 템플릿 = `<div class="col-sm-4">
 < img src="https://via.placeholder.com/600" class="w-100">
 <h5>${b.title}</h5>
 <p>가격 : ${b.title}</p>
 </div>`;
document.querySelector('.row').insertAdjacentHTML('beforeend',템플릿);
 })
 })
 }else if(count ==2 ) {
$.get('https://codingapple1.github.io/js/more2.json').done(function(data){
data.forEach((b,i)=>{
var 템플릿 = `<div class="col-sm-4">
 < img src="https://via.placeholder.com/600" class="w-100">
 <h5>${b.title}</h5>
 <p>가격 : ${b.title}</p>
 </div>`;
document.querySelector('.row').insertAdjacentHTML('beforeend',템플릿);
 })
 })
document.getElementById('more').style.display ='none';
 }
})

----------------------------------------------------------------------

products.forEach((a,i)=>{
var 템플릿 = `<div class="col-sm-4">
 < img src="https://via.placeholder.com/600" class="w-100">
 <h5>${a.title}</h5>
 <p>가격 : ${a.title}</p>
 </div>`;
$('.row').append(템플릿)
})

$('#more').click(function(){
count++;
if(count == 1){
$.get('https://codingapple1.github.io/js/more1.json').done(function(data){
data.forEach((a,i)=>{
var 템플릿 = `<div class="col-sm-4">
 < img src="https://via.placeholder.com/600" class="w-100">
 <h5>${a.title}</h5>
 <p>가격 : ${a.title}</p>
 </div>`;
$('.row').append(템플릿)
 })
 })
 }else if(count == 2){
$.get('https://codingapple1.github.io/js/more2.json').done(function(data){
data.forEach((a,i)=>{
var 템플릿 = `<div class="col-sm-4">
 < img src="https://via.placeholder.com/600" class="w-100">
 <h5>${a.title}</h5>
 <p>가격 : ${a.title}</p>
 </div>`;
$('.row').append(템플릿)
 })
 })
$('#more').addClass('hidden');
 }
})

[codingapple]

함수로 빼면 함수안에 있는 변수들은 파라미터로 입력할 수 있게 만드는게 좋습니다
data같은거요

[글쓴이]

글