jQuery-UI: диалог удаления класса

Question

У меня есть диалоговое окно, созданное с помощью кода JavaScript и HTML, сгенерированного ниже. Я хотел бы удалить класс "ui-button-text-only" для кнопок и для контейнера и добавить "style = font-size: 0.9em;"

Не могли бы вы мне помочь?

Спасибо

HTML:

<div class="ui-dialog-buttonpane ui-widget-content ui-helper-clearfix">
    <button type="button" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" role="button">
        <span class="ui-button-text">Save</span>
    </button>
    <button type="button" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" role="button">
        <span class="ui-button-text">Cancel</span>
    </button>
    <button type="button" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" role="button">
        <span class="ui-button-text">Delete</span>
    </button>
</div>

Javascript:

<div id="dialogProduct" title="MyTitle"></div>
<script type="text/javascript">
function CreateDialogProduct() {
    $("#dialogProduct").dialog({
        bgiframe: true, autoOpen: false, minHeight: 350, maxHeight: 450, height: 350,
        minWidth: 450, maxWidth: 550, width: 450,
        modal: true,
        buttons: {
            Save: function() {
                $.ajax({
                    type: "POST",
                    url: "/Product/SaveOrUpdate",
                    data: {...},
                    success: function(data) {...},
                    error: function(XMLHttpRequest, textStatus, errorThrown) {
                    }
                })
            },
            Cancel: function() {...},
            Delete: function() {
                $.ajax({
                    type: "POST",
                    url: "/Product/Delete",
                    data: {...},
                    success: function(data) {},
                    error: function(XMLHttpRequest, textStatus, errorThrown) {
                    }
                })
            }
        },
        beforeclose: function(event, ui) {
        }
    });
}    
jQuery(document).ready(function() {
    CreateDialogProduct();
});
</script>

Answer 1

$('button').removeClass("ui-button-text-only");
$('button:parent').css('font-size', '0.9em');

//or if you want to do it in a single line:
$('button').removeClass("ui-button-text-only").parent().css('font-size', '0.9em');

---

Ответ на комментарий: Если у вас есть класс CSS, например:

.small{
  font-size:0.9em;
}

во включенном файле CSS вы можете сделать следующее:

$('button').removeClass("ui-button-text-only").parent().addClass('small');