ajax 2 응용문제 질문입니다

[이은애]

1. 더보기버튼을 2번째 누르면 7,8,9번째 상품을 더 가져와서 html로 보여주십시오

해당 문제 풀이 중인데요,


[html]

  <div class="container">
    <div class="row">
  
  
    </div>
  </div>

  <div class="container">
    <button class = "btn btn-danger">더보기</button>
  </div>

[js]
  $('.btn').on('click', function(){
    var count = 0;
    count++;
    
    if (count == 1){
    $.get('https://codingapple1.github.io/js/more1.json').done(function(data){
      data. forEach((b, i) =>{  
    var b = `<div class="col-sm-4">
    < img src="https://via.placeholder.com/600" class="w-100">
    <h5>${data[i].title}</h5>
    <p>${data[i].price}</p>
    </div>`;
  $('.row').append(b);})
    })}
    else if(count == 2){
      $.get('https://codingapple1.github.io/js/more2.json').done(function(data){
      data. forEach((b, i) =>{  
    var b = `<div class="col-sm-4">
    < img src="https://via.placeholder.com/600" class="w-100">
    <h5>${data[i].title}</h5>
    <p>${data[i].price}</p>
    </div>`;
  $('.row').append(b);})
    })
    }
    else{$('.btn').hide
      
    }
  })

첫번째로 눌렀을때는 박스가 추가가 되는데, 두번째부터 실행이 되지를 않습니다..
어디를 고쳐야할지 알려주시면 감사하겠습니다...!

그리고 

function 더하기() {
  data. forEach((b, i) =>{  
    var b = `<div class="col-sm-4">
    < img src="https://via.placeholder.com/600" class="w-100">
    <h5>${data[i].title}</h5>
    <p>${data[i].price}</p>
    </div>`;
  $('.row').append(b);})
    };

이런식으로 함수를 축약해서 넣어봤는데, 이것도 실행이 되지를 않아서요! 어디가 문제일까요?

[codingapple]

var count = 0;를 바깥에 써봅시다 
함수로 싸매려면 함수 안에 있는 변수같은건 파라미터 같은걸로 집어넣어서 쓰도록 정의해줘야합니다

[글쓴이]

글