<!DOCTYPE html>
<div>
<div class="toolbar">
<button data-command="bold" title="Жирный жирный жирный. Как поезд пассажирный">Жирный</button>
<div contenteditable="">Редактируемый текст</div>
</div>
<script>
(function() {
function onButtonClick() {
document.execCommand(this.getAttribute('data-command'), null, null);
}
function cancelEvent() {
return false;
}
var toolbarButtons = document.querySelectorAll('.toolbar button');
for (var i = 0; i < toolbarButtons.length; i++) {
toolbarButtons[i].onclick = onButtonClick;
toolbarButtons[i].onmousedown = cancelEvent;
}
})();
</script>
</div>