You could use the contenteditable="true"
parameter in a div in which you could paste or display the text such as the following example :
<div class='page' style="display:block;" contenteditable="true"></div>
And modify it with the powerful JS function (a little deprecated) execCommand();
Example :
<input type="button" value="B" onclick="document.execCommand('bold', false, '');" style="font-weight:bold"/>
<input type="button" value="I" onclick="document.execCommand('italic', false, '')" style="font-style:italic"/>
<input type="button" value="U" onclick="document.execCommand('underline', false, '')" style="text-decoration:underline"/>
<input type="button" value="S" onclick="document.execCommand('strikeThrough', false, '')" style="text-decoration:line-through"/>
That code will change the selected text, for example, if the user pushes the B or bold button, the selected text will be displayed in bold and in the source code of your webpage, there will be some <b></b>
tags around the selected text.
Here a list of the function's arguments on MDC
This is an easy way of creating your own WYSIWYG HTML editor. But there are some limits...