I created a webpage that is a gallery of all my products, and this page uses js to manipulate those images (change colour, change angle, etc). Each of the image is assigned div ids.

I am trying to now only embed different div into other pages on the same domain, but still allowing the js scripts to run in the embedded pages - but this doesn't seem to happen.

I've tried using these codes I've found:

    $("#mylocaldiv").load("https://mywebsite/gallery/ #divtoshow");
    <div id="mylocaldiv">
    </div>

    $.ajax({
    url:'https://mywebsite/gallery/',
    type:'GET',
    success: function(data){
    $('#mylocaldiv2').html($(data).find('#divtoshow').html());
    }
    });
    <div id="mylocaldiv2">
    </div>

Both of these are displaying correctly on the embedded page, but it doesn't seem to allow the scripts to run.

So hoping someone could at least let me know what method should I be looking into, that would allow me to embed part of a webpage into another webpage (on same domain), that also imports the scripts from the source page to the embedded page.