ダイアログ内からボタンをクリックしてjQuery-uiダイアログオーバーレイ画像を変更しようとしていますが、下のコードではオーバーレイ画像は変更されません。クリックイベントでオーバーレイのCSSを動的に編集する必要があります。
$("document").ready(function(){
var divCustom = '<div id="myOverlay">
<div id="button1">button1</div>
<div id="button2">button2</div>
</div>';
$(divCustom).dialog({ height: 400, width: 700, modal: true });
$("#button1").click(function(){
$("#myOverlay .ui-widget-overlay").css({
"background-image": "happy.gif"
});
});
$("#button2").click(function(){
$("#myOverlay .ui-widget-overlay").css({
"background-image": "sad.gif"
});
});
});