JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.jquery.com/jquery-1.12.0.min.js"></script>
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.11.4/themes/black-tie/jquery-ui.css">
<div id="modal" style="display: none;">loading...</div>
<a href="#" class="ajax">click me</a>

JavaScript

$('.ajax').on('click', function(){

        $.ajax({
            url: '/',
            beforeSend: function(){

                $('#modal').dialog({
                    modal: true,
                    width: 100,
                    height: 100
                });

            },
            success: function(data){

                $('#modal').dialog({ height:'auto',  width:'auto', position: { my: 'center', at: 'center' } }).html(' new value new value new<br> value new value new value new value new value new value new value new<br>new value new value new<br>new value new value new<br>new value new value new<br>new value new value new<br>new value new value new<br>new value new value new<br>');
            }
        });

        return false;

    });