Hi I have this piece of code that allows me to toggle one at a time. However there is a bug where if I click the first button out of the two it does what I want but, when the second button is clicked I can't untoggle the first button. However if I select the second button first and then select the first button the second button gets untoggled and the first one is now active.

<button type="button" id="b1"class="btn btn-primary " data-bs-toggle="button" value="Toronto" onClick="GetWeatherInfo()">Toronto Oakvile

  var btn1 = document.getElementById('b1');
  var btn2 = document.getElementById('b2');
  var selectedCity;

  if (btn1.classList.contains('active')){
    btn2.classList.remove("active");
    var selectedCity=document.getElementById("b1").value;
  }
  else if(btn2.classList.contains('active')){
    btn1.classList.remove("active");
    var selectedCity=document.getElementById("b2").value;
  }