<<jquery>>논리적오류_appendTo()

하고 싶었던 것

imgbox당 img를 하나씩 append하고 싶음.

문제

첫번째 imgbox에 img가 5개, 2번째 imgbox에 img가 4개 3번째 imgbox에 img가 3개 ...
이런식으로 append됨.

let li = '<li class="swiper-slide"></li>';
let div = '<div class="imgbox"></div>';
let div_desc = '<div class="item_desc"></div>';
$(li).appendTo('.best_item_box');
$(div).appendTo('.best_item_box .swiper-slide');
$(div_desc).appendTo('.best_item_box .swiper-slide');
for(let i = 0; i<1; i++){
	let img = '<img src = ".." alt = "..">'
    $(img).appendTo(.best_item_box .imgbox).eq(i);
}

해결

appendTo가 아닌 append를 사용.

let li = '<li class="swiper-slide"></li>';
let div = '<div class="imgbox"></div>';
let div_desc = '<div class="item_desc"></div>';
$(li).appendTo('.best_item_box');
$(div).appendTo('.best_item_box .swiper-slide');
$(div_desc).appendTo('.best_item_box .swiper-slide');
for(let i = 0; i<1; i++){
	let img = '<img src = ".." alt = "..">'
    $(.best_item_box .imgbox).eq(i).appendTo(img);
}

뒤에 .eq(i)는 앞에 선택자에게 적용이 되므로 .imgbox.eq(i)에 img가 append되는게 아니라,
for문을 돌릴 때 마다 모든 .imgbox에 img가 append되는 문제였음.