title: How to add Buttons after created a Jquery Dialog UI
body: <p>I want to create a jquery dialog and needs to add buttons to it.</p>
  
  <p>I'm using the following code which works fine in IE but not in Mozilla.</p>
  
  <p>Can any one figure out what is the issue here?</p>
  
  <pre><code>function dialog_box(dynDiv, rootTemplate) {
      var dialog_buttons = rootTemplate.buttons;
      var dialog = $("#" + dynDiv.id).dialog({
          hide: "explode",
          title: rootTemplate.etype,
          buttons:'',
          text: rootTemplate.text,
          resizable: true,
          minWidth: 200,
          minHeight: 150,
          close: function () {
              $(dialog).dialog('destroy').remove();
          }
      });
  
  
      var buttonSet = $("#" + dynDiv.id).parent().find('.ui-dialog-buttonset');
      $.each(dialog_buttons, function (index, props) {
          var newButton = $('&lt;button&gt;&lt;/button&gt;', {
              id: "btn" + dynDiv.id + props.id,
              text: props.text
          });
          newButton.button().unbind().on("click", props.handler);
  
          $(buttonSet).append(newButton);      
      });
  
  
  }
  </code></pre>
  
  <p><a href="http://jsfiddle.net/AvF8V/12/" rel="nofollow">Sample</a></p>