Некоторые переключатели не останутся отмеченными при изменении в JavaScript

Question

Эта проблема недавно возникла (особенно в Chrome), когда некоторые из наших радиокнопок не нажимаются или их нужно нажимать много раз, чтобы оставаться отмеченным.

Вот фрагмент (пропуститьдо последнего куска кода):

var createNetworkList = function(parent, ssid){
  var randToken = Math.random().toString(36).substring(2);
  var radio = document.createElement('input');
  radio.type = 'radio';
  radio.value = ssid;
  radio.id = ssid + randToken;
  radio.name = 'ssid';
  radio.className = 'radio radio-input' ;
  var parentDiv = document.createElement('DIV');

  var div = document.createElement('DIV');
  parentDiv.className = 'field';
  div.className = 'ui radio checkbox radio-div';
  div.appendChild(radio);
  var label = document.createElement('label');
  label.htmlFor = ssid;
  label.innerHTML = ssid;
  div.appendChild(label);
  parentDiv.appendChild(div)
  parent.appendChild(parentDiv);

  // HERE IS WHERE THE TROUBLE IS HAPPENING
  parentDiv.addEventListener('click', function(){
    this.firstElementChild.firstElementChild.checked = true
    debugger // when you type `this.firstElementChild.firstElementChild.checked` it says `true`
    return true
  })

};

Сначала я убедился, что все они имеют уникальные идентификаторы, которые не работают. Затем я удостоверился, что это мой клик возвращал что-то в конце, это тоже не сработало. Я пробовал разные вещи, , но этот код работал очень долго, до недавнего времени. Насколько сложным должно быть исправление?

Вот сгенерированный HTML-код:

<div class="grouped fields" id="networks-div" style="display: block;">
  <div class="field" style="border-left: 1px solid gainsboro;">
    <div class="ui radio checkbox radio-div">
      <input type="radio" value="React-Wireless" id="React-Wirelessri99pzth88f" name="ssid" class="radio radio-input">
      <label for="React-Wireless">React-Wireless</label>
    </div>
  </div>
  <div class="field" style="border-left: 1px solid gainsboro;">
    <div class="ui radio checkbox radio-div">
      <input type="radio" value="Charzinder-9PGP" id="Charzinder-9PGPr5cm2bz0k1b" name="ssid" class="radio radio-input">
      <label for="Charzinder-9PGP">Charzinder-9PGP</label>
    </div>
  </div>
  <div class="field" style="border-left: 1px solid gainsboro;">
    <div class="ui radio checkbox radio-div">
      <input type="radio" value="Jhatka" id="Jhatkabg0vq1mfv5d" name="ssid" class="radio radio-input">
      <label for="Jhatka">Jhatka</label>
    </div>
  </div>
  <div class="field" style="border-left: 1px solid gainsboro;">
    <div class="ui radio checkbox radio-div">
      <input type="radio" value="ORDGuest" id="ORDGuestzg0qcdhv6k" name="ssid" class="radio radio-input">
      <label for="ORDGuest">ORDGuest</label>
    </div>
  </div>
  <div class="field" style="border-left: 1px solid gainsboro;">
    <div class="ui radio checkbox radio-div">
      <input type="radio" value="CharzinderWifi-Office-2.4G" id="CharzinderWifi-Office-2.4Gkfd9zl8hq" name="ssid" class="radio radio-input">
      <label for="CharzinderWifi-Office-2.4G">CharzinderWifi-Office-2.4G</label>
    </div>
  </div>
</div>