title: Getting text content of <option> in <select> onChange event
body: <p>I have the following select form input:-</p>
  
  <pre><code>const divisions = {
    pages: [
      { id: 1, text: "page text" },
    ],
    sections: [
      { id: 1, text: "option 1" },
      { id: 2, text: "option 2" },
    ],
    parts: [
      { id: 1, text: "part 1" },
      { id: 2, text: "part 2" },
    ],
  };
  
  const divisonSelection = division.sections;
  
          &lt;select
            className="form-control"
            for={title}
            onChange={(e) =&gt;
              setDivisionVariant({
                id: e.target.value,
                text: \\Here i want to show the selected &lt;option&gt; text value "v.text",
              })
            }
          &gt;
            {divisonSelection.map((v, key) =&gt; (
              &lt;option for={v.text} key={key} value={v.id}&gt;
                {v.text}
              &lt;/option&gt;
            ))}
          &lt;/select&gt;
  </code></pre>
  
  <p>How can i get the value of the selected  in onChange event of the  element without the need to make a function outside the  element ?</p>