「もっと読み込む」ボタン→スピナー変化

<div class="d11-10-04-wrap">
          <div class="d11-10-04-scroll" id="d1464Scroll">
            <ul class="d11-10-04-list" id="d1464List">
              <li>商品: レザーミニトート &yen;8,900</li>
              <li>商品: リネンシャツ &yen;5,400</li>
              <li>商品: キャンバススニーカー &yen;6,200</li>
            </ul>
          </div>
          <button type="button" class="d11-10-04-btn" id="d1464Btn"><span class="d11-10-04-label">もっと読み込む</span><span class="d11-10-04-spin"></span></button>
        </div>

.prev.d11-10-04{align-items:flex-start;justify-content:flex-start}
        .d11-10-04-wrap{width:100%}
        .d11-10-04-scroll{height:168px;overflow-y:auto;border-radius:12px;background:#f8f9fb;border:1px solid #eef0f3;padding:8px;margin-bottom:10px}
        .d11-10-04-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:7px}
        .d11-10-04-list li{background:#fff;border:1px solid #eef0f3;border-radius:8px;padding:9px 11px;font-size:11.5px;color:#374151}
        .d11-10-04-btn{display:flex;align-items:center;justify-content:center;width:100%;padding:10px;border:1px solid #d1d5db;border-radius:8px;background:#fff;color:#4f46e5;font-size:12.5px;font-weight:700;cursor:pointer;transition:background .2s}
        .d11-10-04-btn:hover{background:#eef2ff}
        .d11-10-04-spin{display:none;width:16px;height:16px;border:2.5px solid #c7d2fe;border-top-color:#4f46e5;border-radius:50%}
        .d11-10-04-btn.is-loading .d11-10-04-label{display:none}
        .d11-10-04-btn.is-loading .d11-10-04-spin{display:block;animation:d1464Spin .7s linear infinite}
        .d11-10-04-btn.is-loading{cursor:wait;color:#a5b4fc}
        @keyframes d1464Spin{to{transform:rotate(360deg)}}

(function(){
        var root=document.getElementById('item-11-10-04');
        var list=root.querySelector('#d1464List');
        var btn=root.querySelector('#d1464Btn');
        var items=['ウールマフラー ¥4,300','デニムジャケット ¥9,800','コットンキャップ ¥2,600','レザーベルト ¥5,100','ニットベスト ¥6,700'];
        var idx=0;
        btn.addEventListener('click',function(){
          if(btn.classList.contains('is-loading'))return;
          btn.classList.add('is-loading');
          setTimeout(function(){
            for(var i=0;i<2;i++){
              var li=document.createElement('li');
              li.textContent='商品: '+items[idx%items.length];
              idx++;
              list.appendChild(li);
            }
            btn.classList.remove('is-loading');
          },800);
        });
      })();