Scrollbox içerisine div ekleme (responsive)

Herkese merhaba yine ben
Böyle bir tasarım var Ekle butonu tıklayınca yan tarafa scrollbox içerisine eklemek istiyorum ancak responsive olrak gelmiyor bunu nasıl yapabilirim kaynak kodlar aşağıda

$(document).ready(function () {
    $('.listeEkle').click(function (event) {

        $("#copy").animate({ scrollTop: $(document).height() }, "fast");


        var icerik = '<a href="#" class="d-flex align-items-center py-2 liste" value=""><div class="flex-shrink-0 avatar-xs me-3"><div class="avatar-title bg-light text-primary rounded-circle"><i class="ri-hashtag"></i></div></div><div class="flex-grow-1 overflow-hidden"><h5 class="fs-14 mb-1">ABC Project Customization</h5><p class="text-muted mb-0">04 Members</p></div><div class="flex-shrink-0 align-self-start ms-2"><div class="badge badge-soft-primary fs-10">Inprogress</div></div></a>';

        $('#copy').append(icerik);

    })
})

Scrol alanında kaynak kodunu iletebilirseniz eğer

hocam çözdüm sorun template class dosyasındaymış kendim yazdım scrolbox sorun çözüldü çok teşekkürler

Rica ederim. HTML kodunu JavaScript içerisinde kendiniz yazmayın, scroll içerisindeki div'i clone() ettirip içerisindeki değerleri değiştirin, daha doğru olur.
https://api.jquery.com/clone/