How to change background Image with DOM and JavaScript

---

Hi Everyone,
I am a beginner working on a small project in which I am facing an issue related to the background image (how I can change the background image using DOM and Javascript). I Have tried a few ways but am still on the problem side. I have used JavaScript function (random_image_picker(min,max)) for getting random image from Image_gallery. Everything going well until when I clicked on background_theme btn, the background image was supposed to be changed but not working. Every help would be appreciated.
Thanks
HTML Tag…

..Background Image….

   <script>
        const image_gallery = ['https://img.playbuzz.com/image/upload/ar_1.5,c_pad,f_jpg,b_auto/q_auto:good,f_auto,fl_lossy,w_480,c_limit,dpr_1/cdn/2c2dd0ea-8dec-4d49-8a95-f7b18f0b7aed/df312655-1d96-457d-88f4-cfc93c580d1d_560_420.jpg',
            'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTwpR0X1hmpt4Kd2WviLXQGPrnUllW2UoLgtoWBoesgtFtSPFCF808bibJ8K2VhHRCki48&usqp=CAU',
            'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRxmLTuD78jeZaVR3I_xfIuvmE4tse_JuhGjQ&usqp=CAU',
            'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSxWrBodkwbTlxbMexeQCOneifPHaOUoTFwPA&usqp=CAU',
            'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTtQMwmsMjdYfF0W0cyMPX673aKVK3m8sSDjg&usqp=CAU']
        function random_image_picker(min, max) {
            let a = Math.floor(Math.random() * (max - min + 1) + min);
            return image_gallery[a];
        }
        let background_theme = document.querySelector('#background_theme');
        let main = document.getElementsByTagName('main');
        background_theme.addEventListener('click',function(){
            main.style.backgroundImage = URL(random_image_picker(0,4))
        })


    </script>