<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-confirm/3.3.2/jquery-confirm.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-confirm/3.3.2/jquery-confirm.min.js"></script>

<button class="btn btn-primary btn-secondary js-demo-confirm" data-title="Delete “My Script Title”?" data-content="This action cannot be undone." data-type="red">
    Preview dialog
</button>

<script>
    $(function() {
        $('.js-demo-confirm').on('click', function() {
            var $btn = $(this);
            $.confirm({
                title: $btn.data('title'),
                content: $btn.data('content'),
                type: $btn.data('type'),
                typeAnimated: true,
                buttons: {
                    confirm: {
                        text: 'Confirm',
                        btnClass: 'btn-' + $btn.data('type'),
                        action: function() {
                            return false;
                        }
                    },
                    cancel: {
                        text: 'Cancel',
                        action: function() {}
                    }
                }
            });
        });
    });
</script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-confirm/3.3.2/jquery-confirm.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-confirm/3.3.2/jquery-confirm.min.js"></script>

<button class="btn btn-primary btn-secondary js-demo-confirm"
  data-title="{{title}}"
  data-content="{{content}}"
  data-type="{{type}}">
  Preview dialog
</button>

<script>
  $(function () {
    $('.js-demo-confirm').on('click', function () {
      var $btn = $(this);
      $.confirm({
        title: $btn.data('title'),
        content: $btn.data('content'),
        type: $btn.data('type'),
        typeAnimated: true,
        buttons: {
          confirm: {
            text: 'Confirm',
            btnClass: 'btn-' + $btn.data('type'),
            action: function () { return false; }
          },
          cancel: { text: 'Cancel', action: function () {} }
        }
      });
    });
  });
</script>
{
  "title": "Delete “My Script Title”?",
  "content": "This action cannot be undone.",
  "type": "red"
}

Uses jquery-confirm 3.3.2. Always use for destructive or irreversible actions. Click “Preview dialog” to see it rendered. The type prop controls the colour theme — use red for delete/danger actions.

Appears in: Delete script, delete social post, disconnect YouTube channel, bulk delete scripts (TS-3274), remove audience avatar. Any action that cannot be undone must go through this dialog.