Jquery hide not working in my dialog

Question

$('.ui-dialog-titlebar-close ui-corner-all').hide();

this is a hide for my jquery dialog close 'X' span .. this does not work in my case.

I am trying to hide this Close, because it does not show in my dialog when I resize my dialog and then show it to me. For some reason, my CSS doesn't show me that the Close button is correct on my POPUP.

Can any body help me.

here is my code and CSS.

  $("#window").dialog({
          resizable: true,
          height: 180,
          title: titles,
          width: 500,
          modal: true,
          open: function () {
              $('.ui-widget-overlay').show();
              $('.ui-dialog-titlebar-close ui-corner-all').hide();
          },
          buttons: {
              "OK": function () {
                  $(this).dialog("close");
                  if (redirectURL) {
                      window.location = redirectURL;
                  }
              }
          }
      });

here is my CSS.

<style>
.ui-widget-overlay {
    background: black;
    opacity: 0.5;
    filter: alpha(opacity = 50);
    position: absolute;
    top: 0;
    left: 10;
 }
</style>

Can any body tell me how to correctly show My Close 'X' in my dialog box, or do I need to hide that Close 'X'

thank

Answer 1

The selector for several CSS classes has a complete stop between them, for example:

$('.ui-dialog-titlebar-close.ui-corner-all').hide();