title: How to get the textbox's id by cursor position
body: <p>I have multiple textboxes inside a div element. I want to insert some text one of the textbox by cursor position on a button click. I am successfully inserted text if I know the id of a textbox, but i am having problem to know the element wheres the cursor currently positioned.</p>
  
  <pre><code>&lt;div&gt;
  
      &lt;input type="text" id="txt1" /&gt;
      &lt;input type="text" id="Text2" /&gt;
      &lt;input type="text" id="Text3" /&gt;
      &lt;input type="button" value="Add" id="btnAdd" /&gt;
      &lt;/div&gt;
  
  $('#btnAdd').click(function () {
              insertDataVarables(document.getElementById('txt1'), 'insertedText')
      });
  
      function insertDataVarables(myField, myValue) {
          //IE support
          if (document.selection) {
              myField.focus();
              sel = document.selection.createRange();
              sel.text = myValue;
          }
          //MOZILLA and others
          else if (myField.selectionStart || myField.selectionStart == '0') {
              var startPos = myField.selectionStart;
              var endPos = myField.selectionEnd;
              myField.value = myField.value.substring(0, startPos)
                  + myValue
                  + myField.value.substring(endPos, myField.value.length);
              myField.selectionStart = startPos + myValue.length;
              myField.selectionEnd = startPos + myValue.length;
          } else {
              myField.value += myValue;
          }
      }
  </code></pre>
  
  <p>So how could I know the textbox id by cursor position.</p>
  
  <p>Thanks in advance</p>