title: jQuery dialog background change
body: <blockquote>
    <p>Duplicate of
    <a href="https://stackoverflow.com/questions/1886678/jquery-ui-dialog-overlay">jQuery UI dialog overlay</a></p>
  </blockquote>
  
  <p>have used different jQuery dialogs. For some dialogs I want a transparent background. If I change the background CSS in the .ui-widget-overlay class then it will apply to all the dialogs.</p>
  
  <p>How to set different background colors for different dialogs?</p>
  
  <p>I wrote the below code but it still taking the background of class ".ui-widget-overlay"</p>
  
  <pre><code>$("#dialog_empty").dialog({     
      dialogClass:'transparent',                    
      resizable: false, 
      draggable: false, 
      modal: true,                
      height: 0, 
      width: 0,
      autoOpen: false,
      overlay: {
          opacity: 0
      }
  });
  
  $('#dialog_empty').dialog('open');
  $('#dialog_empty').css('display','');
  </code></pre>