title: How to detect mouse click position in jquery
body: <p>I am trying to make a website where user can post there article. I want them allow some html tagging. But as user may not know about html, I am using some button for automatic inserting the content, so that they can add some effect to their content. For example if any user wants to write some bold text he can click on a button named "bold" and code will be automatically inserted. Following is an image of what is my design. </p>
  
  <p><img src="https://i.stack.imgur.com/JCgGi.png" alt="enter image description here"></p>
  
  <p>Everything is working fine. I am adding all those code at the end. But it is not good while editing. Let user wants to add some bold text at the middle. So he expects to click at the middle and press the bold button, but even in the case I add my code at the end.</p>
  
  <p>So is there any way to detect the mouse click position and adding my text right after that ? Any suggestion(I am using jQuery)?</p>