How to customize the layout of the modal window in which the wordpress post opens?

Question

HTML

I set up ajax in wordpress and it works, but the problem is that when clicking on a post, a modal window opens, inside of which is the same modal window. Maybe it's possible to fix it somehow? Here is the code in functions.php :

add_action('wp_ajax_my_action', 'data_fetch');
add_action('wp_ajax_nopriv_my_action', 'data_fetch');
function data_fetch($postID){
    $postID=intval( $_POST['param'] );

    $args = array(
    'p' => $postID, // ID of a page, post, or custom type
    //’post_type’ => ‘any’
    );
    $recent = new WP_Query($args);
    while ( $recent->have_posts() ) : $recent->the_post();?>
    <div class="modal-content ajax popup">
         <div class="modal-header popupBg" style="background-image:linear-gradient(180deg, rgba(2,0,36,0) 0%, rgba(0,0,0,1) 100%), url(<?php echo get_the_post_thumbnail_url(); ?>);">
         <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true"><i class="fas fa-times"></i></span>
        </div>
    <h1 class="modal-title"><?php the_title(); ?></h1>
    <span class="author"><time>09.09.09</time> Admin</span>
    <article class="modal-body">
        <?php the_content(); ?>
    </article>
    </div>
    <?php endwhile; ?>
<?php
    die();
}

And the layout of the modal itself in footer.php . Bootstrap modal window

<div class="modal fade bd-example-modal-xl" tabindex="-1" role="dialog" aria-labelledby="myExtraLargeModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-xl">
    <div class="modal-content ajax popup">
    	 <div class="modal-header popupBg" style="background-image:linear-gradient(180deg, rgba(2,0,36,0) 0%, rgba(0,0,0,1) 100%)">
         <button type="button" class="close" data-dismiss="modal" aria-label="Close">
         	<span aria-hidden="true"><i class="fas fa-times"></i></span>
    	</div>
  <h1 class="modal-title"></h1>
  <span class="author"><time>09.09.09</time> Admin</span>
  <article class="modal-body">
    
  </article>
    </div>
  </div>
</div>

js from index.php

<script>
function fetch(e){var param = $(e.target).attr('data-ajax-param');
 // Находим id поста по нажатию кнопки. У кнопки должен быть атрибут data-ajax-param равный id поста, например, data-ajax-param="11"
  $.post('wp-admin/admin-ajax.php', {'action':'my_action', 'param':param}, function(response){
   $('.modal-body').html(response);
});
}
</script>
<script>
$( '[data-ajax-param]' ).click(function (e) {
 fetch(e);
});
</script>
<?php
get_footer();
?>