Comment afficher des témoignages clients de façon aléatoire sur mon site web?

Et voila:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Testimonials</title>
<style>
  body {
    font-family: Arial, sans-serif;
    margin: 0;
    padding: 0;
  }

  .container {
    max-width: 800px;
    margin: auto;
    text-align: center;
    padding: 20px;
  }

  h1 {
    margin-bottom: 20px;
  }

  #testimonial {
    font-style: italic;
    font-size: 18px;
    margin-top: 30px;
  }
</style>
</head>
<body>
<div class="container">
  <h1>Testimonials</h1>
  <div id="testimonial"></div>
</div>
<script>
  // Liste de témoignages
  var testimonials = [
    "Excellent service ! Je recommande vivement !",
    "Très satisfait du produit, livraison rapide.",
    "Le support client est exceptionnel, ils ont résolu mon problème en quelques minutes.",
    "Je suis impressionné par la qualité du produit, ça vaut vraiment le prix."
  ];

  // Fonction pour afficher un témoignage aléatoire
  function displayRandomTestimonial() {
    var randomIndex = Math.floor(Math.random() * testimonials.length);
    var testimonialElement = document.getElementById('testimonial');
    testimonialElement.textContent = testimonials[randomIndex];
  }

  // Afficher un témoignage au chargement de la page
  displayRandomTestimonial();

  // Actualiser le témoignage toutes les 5 secondes
  setInterval(displayRandomTestimonial, 5000);
</script>
</body>
</html>