title: React onSelect event not working
body: <p>Does React have an event handler for the onSelect statement? i.e. if a user selects some text with their mouse within a paragraph (highlighted text) trigger an event that extracts the selected text.</p>
  
  <pre><code>import React, { Component } from 'react';
  
  class ReadModule extends Component {
    selectedText() {
        console.log("You selected some text");
    }
  
    render() {
      return (
            &lt;div id="read-module" className="row"&gt;
              &lt;p&gt;Reading:&lt;/p&gt;
              &lt;span onSelect={this.selectedText}&gt;{this.props.reading}&lt;/span&gt;
            &lt;/div&gt;
      );
    }
  }
  
  export default ReadModule;
  </code></pre>
  
  <p>The above doesn't work. If there is an approach that is better i.e. extracting a string please do let me know! Once i get a simple </p>
  
  <blockquote>
    <p>on highlight trigger function</p>
  </blockquote>
  
  <p>Concept working I can take it from there. Thanks in advance</p>
  
  <p><strong>Solution:</strong></p>
  
  <pre><code>import React, { Component } from 'react';
  
  class ReadModule extends Component {
    selectedText() {
          var txt = "";
          if (window.getSelection) {
                  txt = window.getSelection();
          }
          else if (document.getSelection) {
              txt = document.getSelection();
          } else if (document.selection) {
              txt = document.selection.createRange().text;
          }
  
          alert("Selected text is " + txt);
    }
  
    render() {
      return (
            &lt;div id="read-module" className="row"&gt;
              &lt;p&gt;Reading:&lt;/p&gt;
              &lt;span onMouseUp={this.selectedText}&gt;{this.props.reading}&lt;/span&gt;
            &lt;/div&gt;
      );
    }
  }
  
  export default ReadModule;
  </code></pre>