Динамически менять текст на кнопке Twitter Bootstrap, сохраняя значок?

Как использовать javascript/jquery для изменения текста на кнопке в Twitter Bootstrap без уничтожения значка?

Итак, это моя статическая разметка:

<a class="btn" id="myButton" onclick="doSomething()"><i class="icon-ok"></i> Do it...</a>

Я могу изменить значок, например:

$('#myButton i:first-child').attr('class','icon icon-remove');

Это хорошо, но для любви ко всему хорошему я не могу найти способ установить текст кнопки, не уничтожая икону. Например. если я это сделаю:

$('#myButton').text('Some Remove Text');

Я теряю элемент значка, так как я могу получить доступ только к тексту и редактировать его, сохраняя при этом все дочерние элементы?

Ответы

Ответ 1

Вы можете обернуть содержимое в элемент span, а затем просто найти его в контексте вашего якоря.

$('#myButton span').text('Some Remove Text');

Также вы можете использовать $('# myButton i: first') вместо $('# myButton i: first-child') или даже

$('#myButton i') or $('#myButton > i') which would be shorter.