jQuery UI PopUP Imagem .dialog

jQuery UI PopUP Imagem .dialog

HTML

<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js"></script>
<a href="https://www.imgworlds.com/wp-content/themes/IMG/img/phase3/welcome/trex.png" title="XYZ" class="galeria">
    <img src="https://www.imgworlds.com/wp-content/themes/IMG/img/phase3/welcome/trex.png" alt="XYZ" width="200" height="150" />
</a>
<div id="dialog" title="Basic dialog"> 
</div>

CSS

#dialog {
    border-radius: 0
}

JavaScript

$('.galeria').on('click', function(event){
    
    var title = $(this).attr('title');
    event.preventDefault();
    var path = $(this).attr('href');
    $('#dialog')
    .dialog({
        'title': title,
        'width' : 'auto'
    })
    .append('<img id="theImg" src="'+path+'" />');
    path = $(this).remove('href');
});