title: Get span Id's of selected text using getSelected()
body: <p>I have a weird problem. I don’t quite know how to approach it. We have an application that spits out paragraphs of text with each and every word wrapped in a span with an ID. I am being asked to make a JavaScript to capture the ID's of all the words that a user highlights.</p>
  
  <p>So a simple example of a paragraph is below. </p>
  
  <pre><code>&lt;span id="p-58" class="softWord" onClick="setTranscriptPosition(-58);return false"&gt; that &lt;/span&gt;
  &lt;span id="p177" class="softWord" onClick="setTranscriptPosition(177);return false"&gt; quake &lt;/span&gt;
  &lt;span id="p857" class="softWord" onClick="setTranscriptPosition(857);return false"&gt; briefly &lt;/span&gt;
  &lt;span id="p1697" class="softWord" onClick="setTranscriptPosition(1697);return false"&gt; triggering &lt;/span&gt;
  &lt;span id="p2267" class="softWord" onClick="setTranscriptPosition(2267);return false"&gt; another &lt;/span&gt;
  &lt;span id="p2697" class="softWord" onClick="setTranscriptPosition(2697);return false"&gt; tsunami &lt;/span&gt;
  </code></pre>
  
  <p>I know there is a way to capture the selected text using something like this:(found this at site <a href="http://motyar.blogspot.com/2010/02/get-user-selected-text-with-jquery-and.html" rel="nofollow">http://motyar.blogspot.com/2010/02/get-user-selected-text-with-jquery-and.html</a>)</p>
  
  <pre><code>function getSelected() {
      if(window.getSelection) { return window.getSelection(); }
          else if(document.getSelection) { return document.getSelection(); }
                      else {
                              var selection = document.selection &amp;&amp; document.selection.createRange();
                              if(selection.text) { return selection.text; }
                  return false;
              }
              return false;
          }
  </code></pre>
  
  <p>How would i get the id's of those spans though?</p>