How to prevent collapsible sections from repeating on different product pages

Hi,

I’ve added a collapsible section using multi-state boxes to my product page and when duplicating the product/ adding multiple products, the same shows up on all product pages, and when edited, it makes changes to all the other product pages.

I would like different info to be displayed for each particular product on my site. Is there a fix for this?

This is the script I’m using now:

$w . onReady ( function () {

$w ( '#button1' ). onClick (() => { 
    $w ( '#statebox8' ). changeState ( "expanded" ); 

}) 

$w ( '#button2' ). onClick (() => { 
    $w ( '#statebox8' ). changeState ( "collapsed" ); 
}) 

$w ( '#button3' ). onClick (() => { 
    $w ( '#statebox9' ). changeState ( "expanded2" ); 
}) 

$w ( '#button4' ). onClick (() => { 
    $w ( '#statebox9' ). changeState ( "collapsed2" ); 
}) 

});

Thanks in advance.