title: How to add <span> tag to a selected text in JQuery
body: <p>i have a big paragraph look like this for example</p>
  
  <pre><code>&lt;p&gt; hello this is my paragraph &lt;/p&gt;
  </code></pre>
  
  <p>so i want to append a  tag to the selected text in the whole text
  so if i highlight on  "my paragraph"
  i want the paragraph to be as the following</p>
  
  <pre><code>&lt;p&gt; hello this is &lt;span&gt;my paragraph&lt;/span&gt;&lt;/p&gt;
  </code></pre>
  
  <p>Thank you all</p>