커스텀오버레이 닫기 관련문의드립니다

var positions = [
];
for (var i = 0; i < positions.length; i ++) {

// 마커를 생성합니다

var marker = new kakao.maps.Marker({
map: map, // 마커를 표시할 지도
position: positions[i].latlng // 마커의 위치
});

var overlay = new kakao.maps.CustomOverlay({
content: positions[i].content,
map: map,
position: marker.getPosition()
});

}
// content HTMLElement 생성
var content = document.createElement(‘div’);

var info = document.createElement(‘span’);
info.appendChild(document.createTextNode(pos.title));
content.appendChild(info);

var closeBtn = document.createElement(‘button’);
closeBtn.appendChild(document.createTextNode(‘닫기’));
// 닫기 이벤트 추가
closeBtn.onclick = function() {
overlay.setMap(null);
};

content.appendChild(closeBtn);

// 마커를 클릭했을 때 커스텀 오버레이를 표시합니다
kakao.maps.event.addListener(marker, ‘click’, function() {
overlay.setMap(map);
});
}

코딩 완전 생초보로 이 사이트 보며 공부중인데 여러 예제 보고 해봐도 닫기가 안되네요…
도와주세요 ㅠㅠ

먼저 스코프 유지를 위해서 for문 대신 forEach와 같은 문법을 사용해주세요.
반복문에서 마커와 커스텀 오버레이를 생성해주세요.
이때 커스텀 오버레이에 적용할 content를 HTMLElement로 생성하고, 이벤트를 등록해주세요.

아래 답변도 함께 참고해서 로직 수정해주세요.
https://devtalk.kakao.com/t/topic/54337/2?u=lea.ju