SweetAlert

• HTML
• JavaScript

<button id="swal-button1" class="waves-effect waves-light btn">Try Me!</button>

$('#swal-button1').on('click', function() {    swal("Here's a message!");});

• HTML
• JavaScript

<button id="swal-button2" class="waves-effect waves-light btn">Try Me!</button>

$('#swal-button2').on('click', function() {    swal("Here's a message!", "It's pretty, isn't it?");});

• HTML
• JavaScript

<button id="swal-button3" class="waves-effect waves-light btn">Try Me!</button>

$('#swal-button3').on('click', function() {    swal("Good job!", "You clicked the button!", "success");});

• HTML
• JavaScript

<button id="swal-button4" class="waves-effect waves-light btn">Try Me!</button>

$('#swal-button4').on('click', function() {    swal({        title: "Are you sure?",        text: "Once deleted, you will not be able to recover this imaginary file!",        icon: "warning",        buttons: true,        dangerMode: true,      })      .then((willDelete) =>{        if (willDelete) {          swal("Poof! Your imaginary file has been deleted!", {            icon: "success",          });        } else {          swal("Your imaginary file is safe!");        }      });});

• HTML
• JavaScript

<button id="swal-button5" class="waves-effect waves-light btn">Try Me!</button>

swal("Are you sure you want to do this?", {    buttons: ["Oh noez!", "Aww yiss!"],});

• HTML
• JavaScript

<button id="swal-button6" class="waves-effect waves-light btn">Try Me!</button>

swal("Are you sure you want to do this?", {    buttons: ["Oh noez!", true],});