Wavesurfer.js: Problem displaying multiple waves

[cesanag]

I'm trying to display more than one waveform on the same page but I think I'm missing something crucial. Only the first audio from an object is rendered, because they all share the same container. Am I doing it wrong somehow?
Pen for reference:
https://codepen.io/cusanag/pen/abzEmmo

Thank you.

[thijstriemstra]

@cesanag you need to create a new div for each waveform and create a new WaveSurfer instance for each div

var wavesurfer1 = WaveSurfer.create({
            container: "#waveform1",
            backgroundColor: 'rgb(10, 10, 10)'
});

var wavesurfer2 = WaveSurfer.create({
            container: "#waveform2",
            backgroundColor: 'rgb(10, 10, 10)'
});

[cesanag]

Thank you.