'p5.js: Assigning a static unique colour to each ellipse in a group

As you can see, each ellipse is part of a wave object and the fill is getting applied on each frame over and over and giving this blinking effect on all ellipses. I want to take a random colour and assign to each ellipse when it is drawn so that it remains with that fill colour instead of defining a new colour at each frame. I tried a lot but couldn't achieve that. Any help would be appreciated.

class Wave {
  constructor(amp, period, phase) {
    this.amplitude = amp;
    this.period = period;
    this.phase = phase;
  }

  evaluate(x) {
    return sin(this.phase + (TWO_PI * x) / this.period) * this.amplitude;
  }

  update() {
    this.phase += 0.05;
  }
}

let waves = [];
    let y;

function setup() {
  createCanvas(600, 400);
  for (let i = 0; i < 5; i++) {
    waves[i] = new Wave(random(20, 80), random(100, 600), random(TWO_PI));
  }
}

function draw() {
  background(0);

  for (let x = 0; x < width; x += 10) {
    for (let wave of waves) {
    y = wave.evaluate(x);
    noStroke();
    fill(random(255), random(255), random(255));
    ellipse(x, y + height / 2, 6);
    }
  }

  for (let wave of waves) {
    wave.update();
  }
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.4.0/p5.min.js"></script>


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source