How to display a modal window after pressing the "submit" button?

Question

JavaScript

Hello
There is a form handler script that, after successful data transfer to the server, displays an alert with some text
. How can I make it display a magnific popup window instead of a window?

$("form").submit(function() { //Change
var th = $(this);
$.ajax({
  type: "POST",
  url: "mail.php", //Change
  data: th.serialize()
}).done(function() {
alert("Thank you!");
setTimeout(function() {
// Done Functions
th.trigger("reset");
  }, 1000);
});
return false;
});

<div id="succes" class="zoom-anim-dialog mfp-hide">
  <h3>Ваша заявка успешно отправлена!</h3>
</div>

The Magnific Popup library itself

Answer 1

add instead of alert("Thank you!");

$.magnificPopup.open({
  items: {
    src: '#succes',
    type: 'inline'
  }
});

https://codepen.io/anon/pen/XEmMmR

Answer 2

Well, instead of alert write

$('form').append('<div id="succes" class="zoom-anim-dialog mfp-hide">
  <h3>Ваша заявка успешно отправлена!</h3>
</div>');

A After the line // Done Functions
$('#succes').remove();