I'm trying to display images on click. Those images have urls that I get from an HTMLCollection. I need to add 2 divs containing different classes, I managed to do it but I can't get the url to display my images on click. Please can someone help me ?

const image = document.querySelector('.slider-image');

image.addEventListener("click", () => {

document.getElementById("modal").classList.remove('hidden')
// Get urls (display gallery items)

let urls = image.getElementsByClassName('gallery-url');

  for (let i=0; i<urls.lenght; i++) {
    const getDivSliderCtn = document.getElementsByClassName("slider-container");
    let div = document.createElement('div');
    div.classList.add('slider-image');
    let bckgImage = div.style.backgroundImage=`url(${urls})`;
    div.appendChild(bckgImage);
    getDivSliderCtn +=urls[i];

}