<textarea id="copyTarget" cols="30" rows="2" class="col-12" readonly>コピー対象</textarea>
<button id="copyTrigger" class="btn btn-primary">
    クリップボードにコピーする
</button>
$(function () {
    /**
     * @summary クリップボードにコピー
     */
    const copyToClipboard = () => {
        const target = $('#copyTarget').val();
        navigator.clipboard.writeText(target)
            .then(e => {
                alert('クリップボードにコピーしました');
            });
    }

    $(document).on("click", "#copyTrigger", () => copyToClipboard());
});
Run Pen

External CSS

  1. https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.0.2/css/bootstrap.min.css

External JavaScript

  1. https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js