如何在jQuery UI中替换对话框标题？

我想删除jQuery UI中的对话框标题并添加关闭按钮。关闭按钮是图像，当用户点击图像时，对话框将被关闭。这是我的片段：

$("#dialog-model").dialog({
    create: function (event, ui) {
        jQuery(".ui-dialog-titlebar").hide();
        $("#dialog-model").css({ 'font-family': 'Helvetica', 'padding': '0', 'font-size': '12px' });
    },
    height: 500,
    width: 900,
    modal: true,

});

我试图在scipt中添加图像，但不起作用

更新答案 试试这个？演示

创建自定义关闭按钮

$(document).ready(function(){
    $("#dialog-model").dialog({
        create: function (event, ui) {
            $('.ui-dialog-titlebar').css({'background':'none','border':'none'});
            $(".ui-dialog-titlebar").html('<a href="#" role="button"><span class="myCloseIcon">close</span></a>');
            $("#dialog-model").css({ 'font-family': 'Helvetica', 'padding': '0', 'font-size': '12px' });
        },
        width: 250,
        height: 150,       
        modal: true,
        resizable: false
    });
    
    $("span.myCloseIcon").click(function() {
        $( "#dialog-model" ).dialog( "close" );
    });
});    

$（文档）.ready（函数（）{
$（“#对话框模型”）.dialog({
创建：函数（事件、用户界面）{
$（'ui dialog titlebar'）.css（{'background'：'none'，'border'：'none'）；
$（“.ui对话框标题栏”）.html（“”）；
$（“#对话框模型”）.css（{'font-family'：'Helvetica'，'padding'：'0'，'font-size'：'12px'）；
},
宽度：250，
身高：150，
莫代尔：是的，
可调整大小：false
});
$（“span.myCloseIcon”）。单击（函数（）{
$（“#对话框模型”）。对话框（“关闭”）；
});
});    

谢谢您的回答，我需要添加图像并按图像，对话框将关闭。我可以用HMTL做，但图像有问题检查我的更新答案和演示，你可以创建一个自定义的关闭btn，见我的例子。