Добавить теги и текст к выбранному пользователем тексту Javascript/JQuery

Question

У меня большой editable таблица, которая может содержать также другие таблицы, и мне нужно добавить теги к выделенному тексту, например <strong> или простой текст. Вот таблица и кнопка:

<table id="list">
  <tr id="row0"><th colspan="2">HEADER</th></tr>
  <tr id="row1"><td id="row1col1"  contenteditable="true" >Row 1, column 1 </td><td id="row1col2"  contenteditable="true" >Row 1, column 2</td></tr>
  <tr id="row2"><td id="row2col1"  contenteditable="true" >Row 2, column 1</td><td id="row2col2"  contenteditable="true" >Row 2, column 2</td></tr>
  <tr id="row3"><td id="row3col1"  contenteditable="true" >Row 3, column 1</td><td id="row3col2"  contenteditable="true" ><table> ///Some elements without ID/// </table></td></tr>
</table>
<input type="button" id="bestrong" value="Make Strong" />

Я хочу это, когда пользователь выделяет текст и нажимает на #bestrong до и после выбора добавляются теги <strong>, как в richtextoxes.

Я действительно новичок в Javascript/JQuery, я много искал, но, вероятно, у меня еще нет необходимых знаний, чтобы понять, как это сделать. Я получаю выделенный текст с этим:

 var selTxt=document.getSelection().text;

И последнее: все, что я читаю в Интернете, использует id,classили иерархическая CSS' selector чтобы определить выбранную позицию текста, не существует способа сделать трюк без них?