Instance mode, adding and removing sketches, creating multiple sketches with a loop

Burans

Hi! I really need to clarify some things regarding instance mode. I hope someone here can help.

1. I have created 3 sketches and I would like to use them as decorative header backgrounds for different pages of a website. The website uses js to pull in content so there is no refresh when user switches between pages - i have to dynamically add and remove corresponding sketches to the header. My idea was to run the sketches in instance mode, assign the necessary sketch to a var - headerBgSketch = new p5(sketch); and run headerBgSketch.remove(); before assigning the next one. For some reason the remove part is not working. I get "Cannot read property 'remove' of undefined". Is this the right way to do something like that?

2. The landing page of the same site has a slider in header instead of the decorative backgrounds. I am using p5 to color correct the images inside the slider. I am using a loop to create a sketch for each image like this:

$(document).ready(function(){ var imgCount = $('.header-img-cont').length; for(c = 1; c < imgCount+1; c++){

        new p5(function (h) {

            var bgimg;
            var src = $('#header-img-cont-'+c).data('src-v');

            h.preload = function() {
                bgimg = h.loadImage(src);
            }

            h.setup = function() {
                h.createCanvas(headerW, headerH);
                drawImage();
            }

            function drawImage() {
                //Draws the image and does some color correcting. I don't need the draw loop for this. I just need to draw it once.

            }

        }, "header-img-cont-"+c);

    }

});

I seems to be working for now. I am just interested if its the right way to do this.

Any comments will be greatly appreciated! Thanks!