classList.remove

[Linuchs]

Moin,

ich habe eine Liste mit 120 Firmen, deren Branchen als Class hinterlegt sind:

<p class="eisenwaren geraeteverleih reparaturen">Müller & Co</p>

Dazu eine Reihe radio-buttons, mit denen ich eine Branche hervorheben kann:

function toggleClass ( klasse ) {
  alert ( "toggleClass ( " +klasse +")" );
  // Markierungen zuruecksetzen
  arr = document.getElementsByClassName("border_color_red");
  for ( i=0; i<arr.length; i++ ) {
    arr[i].classList.remove("border_color_red");
  }
  // neue Markierungen setzen
  arr = document.getElementsByClassName( klasse );  // alle Firmen, die (auch) diese klasse haben
  for ( i=0; i<arr.length; i++ ) {
    arr[i].classList.add("border_color_red");
  }
}

<p>Branche(n) hervorheben: &nbsp;
<label for="radio_keine">
<input
type      = "radio"
id        = "radio_keine"
name      = "klasse"
value     = "keine"
onchange  = "toggleClass( '_keine_' )"
checked

> keine</label> &nbsp;

Problem: Bei Klick auf "keine" behalten einige Firmen ihre Markierung. Bei Klick auf eine andere Branche bleiben auch Firmen markiert, die nicht dazugehören.

Von 25 markierten und klick auf "keine" bleiben 11 markiert. Ein anderes Mal bleiben von 16 8 übrig. Habe keine Erklärung. Was kann das sein?

Gruß, Linuchs