2番目のクラスのみ、classList.replace()で置換する

Question

数種類のボタン毎に、モーダルを開くとモーダル内のリンクボタンのクラスを別のクラス名に
書き換える仕組みをJavascriptで作りたいと調べているのですが、下記のように２つクラスが付いている要素のうち、2番目のクラス（Btn_kanto_01等）
のみ書き換えたい場合はどうすればいいでしょうか。

          <a href="" class="modal-btn　Btn_kanto_01" id="modal-btn01"><span>関東</span> エリア</a>
<!--例 btn-kanto_01→btn-kanto_02 に書き換え-->

classList.replace()を使うと思うのですが、指定の仕方がわかりません。どなたかご教授の程よろしくお願い致します。

<!--モーダル内のリンクボタン群-->
      <ul class="modal-content_list">
        <li class="modal-content_item">
          <a href="" class="modal-btn　Btn_kanto_01" id="modal-btn01"><span>関東</span> エリア</a>
        </li>
        <li class="modal-content_item">
          <a href="" class="modal-btn　Btn_kanto_02" id="modal-btn02"><span>関西</span> エリア</a>
        </li>
        <li class="modal-content_item">
          <a href="" class="modal-btn" id="modal-btn03"><span>北信越・東海</span> エリア</a>
        </li>
        <li class="modal-content_item">
          <a href="" class="modal-btn　Btn_kanto_03" id="modal-btn04"><span>中国・四国</span> エリア</a>
        </li>
        <li class="modal-content_item">
          <a href="" class="modal-btn　Btn_kanto_04" id="modal-btn05"><span>九州・沖縄</span> エリア</a>
        </li>
      </ul>

Answer 1

「　」が「 」となっているとして。
ただし class は順番を意識しないのが普通だと思うので、設計を見直したほうがいいかもしれません。

  const r = c => c.replace(c[1], 'Btn_kanto_02');
  document.querySelectorAll('.modal-btn').forEach(a => r(a.classList));

https://developer.mozilla.org/ja/docs/Web/API/Element/classList

Answer 2

window.addEventListener('DOMContentLoaded', function(e){
  var cn="modal-btn";
  document.querySelectorAll('.'+cn).forEach(x=>{
    console.log(Array.from(x.classList).filter(x=>x!==cn));
  });
});

Comments

[yambejp]

クラス名の区切りを全角のスペースにしているのはまずいですね

Answer 3

手間ではありますが、これでできそうです

document.getElementById('modal-btn01').classList.replace('Btn_kanto_01', 'Btn_kanto_02')

ここに回答が載っていました。

Comments

[kakedashi07]

ご回答ありがとうございます！すみません、質問の仕方が悪かったです。
ボタンを操作するごとにクラス名が変わるので、クラス名を指定する方法が使えないのです...
一度クラスを全て削除してから、置き換えたいクラスを付与する方法が良さそうなので、そちらでやってみます。

[siruku6]

replace自体の使い方ではなくて、繰り返しの操作に耐えうる処理の書き方が知りたかったのですね...。
すみません、早とちりでした。