JSFiddle - React, Tailwind, and code Playground

HTML

<select id='theSelect'>
    <optgroup label="group1">
        <option>option 1</option>
        <option>option 2</option>
    </optgroup>
    <optgroup label="group2">
        <option>option 3</option>
        <option>option 4</option>
    </optgroup>
</select>

JavaScript

var myObj = {};
var theSelect = document.getElementById('theSelect');
var optgroups = theSelect.getElementsByTagName('optgroup');
for (var i=0; i<optgroups.length; i++) {
  myObj[optgroups[i].getAttribute('label')] = [];
  var options = optgroups[i].getElementsByTagName('option');
  for (var j=0; j<options.length; j++) {
    myObj[optgroups[i].getAttribute('label')].push(options[j].innerHTML);
  }
}
console.log(myObj);