droppable 에서 요소 찾기

$('.drop').droppable({
drop: function(event,ui){
var item = $(ui.draggable);
var item_templit = `<div class="item">
<img src="/${item.find('img').first().attr("src")}">
<h5 class="item-title">${item.product_name}</h5>
<p class="item-brand">${item.brand_name}</p>
<p class="item-price">${item.price}</p>
<div class="count">
<p>수량</p>
<input type="number" id="count">
</div>
<p class="class=total mt-4 mb-0">합계 <span></span>원</p>
</div>`;
//text1은 안찾아짐, text2는 찾아짐
let text1 = item.find('.item-brand').text();
let text2 = item.find('p').text();
// $('.drop').after(text);
console.log(text);
}
});

답안과 같이 class로 찾으면 빈칸만 뜨고 text1 처럼 tag로 찾아야 찾아지는데 

어떤 점이 달라서 class명으로 검색이 안되는지 모르겠습니다.