確認用パスワードのリアルタイム一致判定

<div class="d04-11-06-wrap">
          <input type="password" class="d04-11-06-pw" placeholder="パスワード" aria-label="パスワード">
          <input type="password" class="d04-11-06-pw2" placeholder="パスワード(確認)" aria-label="パスワード確認">
          <p class="d04-11-06-msg">確認用のパスワードを入力してください</p>
        </div>

.d04-11-06-wrap{width:min(270px,100%);display:flex;flex-direction:column;gap:10px}
        .d04-11-06-pw,.d04-11-06-pw2{width:100%;padding:12px 14px;font-size:14px;border:2px solid #d5d9e0;border-radius:8px;outline:none;background:#fff;transition:border-color .25s}
        .d04-11-06-pw:focus,.d04-11-06-pw2:focus{border-color:#4a6cf7}
        .d04-11-06-pw2.is-match{border-color:#22b573}
        .d04-11-06-pw2.is-mismatch{border-color:#e5484d}
        .d04-11-06-msg{margin:0;font-size:12px;color:#8a93a3}
        .d04-11-06-msg.is-match{color:#22b573;font-weight:700}
        .d04-11-06-msg.is-mismatch{color:#e5484d;font-weight:700}

(function(){
        var wrap=document.querySelector('.d04-11-06-wrap');
        if(!wrap)return;
        var pw=wrap.querySelector('.d04-11-06-pw');
        var pw2=wrap.querySelector('.d04-11-06-pw2');
        var msg=wrap.querySelector('.d04-11-06-msg');
        function check(){
          pw2.classList.remove('is-match','is-mismatch');
          msg.classList.remove('is-match','is-mismatch');
          if(pw2.value===''){
            msg.textContent='確認用のパスワードを入力してください';
            return;
          }
          if(pw2.value===pw.value){
            pw2.classList.add('is-match');
            msg.classList.add('is-match');
            msg.textContent='パスワードが一致しています';
          }else{
            pw2.classList.add('is-mismatch');
            msg.classList.add('is-mismatch');
            msg.textContent='パスワードが一致しません';
          }
        }
        pw.addEventListener('input',check);
        pw2.addEventListener('input',check);
      })();