JavaScript Duplicate an image carousel - JavaScript

[Spiritwarrior]

On a website I'm creating, I have an image carousel which works perfect.

I would however like to duplicate this loop, on the same page exactly underneath the existing one. However, duplicating the code (html/js) won’t work and will in fact stop the carousel from working. How can I resolve this?

This is the JS-code used:

$(document).ready(() => {
$('#hamburger-menu').click(() => {
$('#hamburger-menu').toggleClass('active')
$('#nav-menu').toggleClass('active')
})
// setting owl carousel
let navText = ["<i class='bx bx-chevron-left'></i>", "<i class='bx bx-chevron-right'></i>"]
$('#hero-carousel').owlCarousel({
items: 1,
dots: false,
loop: true,
nav:true,
navText: navText,
autoplay: true,
autoplayHoverPause: true
})
$('#top-movies-slide').owlCarousel({
items: 2,
dots: false,
loop: true,
autoplay: true,
autoplayHoverPause: true,
responsive: {
500: {
items: 3
},
1280: {
items: 4
},
1600: {
items: 6
}
}
})

 

[Deleted member 2829]

Please post code in code tags, using the </> button. Preferably,post complete code, not just a snippet of JS. Have you checked the Console output for errors ?
Simply duplicating blocks of coding seems like a bad idea. Even if it is only once, consider isolating it in a function that you call twice.