추억앨범에서 카드가 안 나오게 하는 것이 숙제였는데요,

정답 코드를 확인해보니 아예 body 안의 카드 부분을 비우는 식으로 되어 있었습니다.

(아예 처음부터 없게)

아래처럼 empty를 사용해서

($('#card').empty().append(temp_html); )

있었던 카드들이 로딩되면서 사라지게 만들어 봤을 때

처음 한 장만 제대로 동작하고 그 뒤로 제대로 돌아가지 않습니다.

docs.forEach((doc) => {

                let row = doc.data();

                let image = row['image'];

                let title = row['title'];

                let content = row['content'];

                let date = row['date'];

                let temp_html = `

                            <div class="col">

                                <div class="card h-100">

                                    <img

                                        src="${image}"

                                        class="card-img-top"

                                        alt="..."

                                    />

                                    <div class="card-body">

                                        <h5 class="card-title">${title}</h5>

                                        <p class="card-text">${content}</p>

                                    </div>

                                    <div class="card-footer">

                                        <small class="text-body-secondary">${date}</small>

                                    </div>

                                </div>

                            </div>`;

                $('#card').empty().append(temp_html);

            });

정확히 어떻게 동작하고, 어떻게 잘못된 건가요?