setInterval para cada uno de los elementos de un arreglo

Tengo un conjunto de elementos del DOM, cada uno de los cuales necesita su propio temporizador. Eventualmente, verificaré cada X milisegundos si un hijo particular de ese elemento está presente o no, pero por ahora no importa mucho qué sucede dentro del temporizador.

La trampa está en que quiero que los temporizadores se detengan eventualmente. Puedo configurar los temporizadores con setInterval muy bien, funcionan bien, pero no puedo entender cómo usar clearInterval para detenerlos.

Probablemente podría hacer esto con un gran temporizador que observe cada elemento relevante, pero ahora tengo curiosidad y quiero resolver esto. Supongo que probablemente estoy haciendo algo mal en la forma en que declaro o inicio los temporizadores, o clearInterval está apuntando a las funciones setInterval de manera incorrecta.

Aquí está mi código actual:

$(document).ready(function () {
  let interval = 1000;
  let base_count = 1;
  let current_counts = [];
  let timers = [];

  // Contar desde la base hasta el máximo y actualizar el texto para que coincida.
  function counter(p, maxCount, i) {
    p.text(p.text().slice(0,5) + ': ' + current_counts[i]);
    if (current_counts[i] > maxCount) {
      clearInterval(timers[i]);
    }
    current_counts[i]++;
  }

  // Los contadores para cada cosa comienzan en 1
  current_counts = Array($('.thing').length).fill(base_count);
  // Cada cosa tiene su propio temporizador.
  timers = $('.thing').map(function (i, e) {
    function start() {
      return setInterval(
        counter,
        interval,
        $(e),
        10, // Valor máximo para el contador
        i // ¿En qué párrafo estamos?
      );
    }
    return start;
  });

  // Iniciar los temporizadores.
  timers.each((i, e) => e());
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p class="test1 thing">Test1</p>
<p class="test2 thing">Test2</p>
<p class="test3 thing">Test3</p>