Переключение значка на кнопке пользовательского интерфейса jQuery при нажатии

Я пишу веб-приложение для мобильного телефона и хочу, чтобы все флажки были кнопками с пометкой или крестиком, а также с текстом флажок. У меня есть рабочее решение с использованием jQuery UI, но оно не выглядит элегантным. Кто-нибудь может предложить какие-нибудь улучшения?

Вот код:

$(function () {
    $("input[type=checkbox]")
    .button({ icons: { primary: "ui-icon-circle-close"} })
    .click(function () {
        if (this.checked) {
            $(this).button("option", "icons", { primary: 'ui-icon-circle-check' })
        }
        else {
            $(this).button("option", "icons", { primary: 'ui-icon-circle-close' })
        }
    });
    $("input[type=checkbox]:checked")
    .button({ icons: { primary: "ui-icon-circle-check"} })
    .click(function () {
        if (this.checked) {
            $(this).button("option", "icons", { primary: 'ui-icon-circle-check' })
        }
        else {
            $(this).button("option", "icons", { primary: 'ui-icon-circle-close' })
        }
    });
});