如何在“opt group element”中动态嵌套“option element”？

<select>
  <optgroup id="myOptgroup" label="Options">
    <!-- Dynamic options will be added here -->
  </optgroup>
</select>

<script>
  // 获取到要动态嵌套选项的optgroup元素
  var optgroup = document.getElementById('myOptgroup');
  
  // 创建一个空的字符串变量
  var optionsHTML = '';
  
  // 模拟选项数据
  var optionsData = [
    { label: 'Option 1', value: '1' },
    { label: 'Option 2', value: '2' },
    { label: 'Option 3', value: '3' }
  ];
  
  // 遍历选项数据，拼接HTML代码
  for (var i = 0; i < optionsData.length; i++) {
    var option = optionsData[i];
    optionsHTML += '<option value="' + option.value + '">' + option.label + '</option>';
  }
  
  // 将拼接好的选项HTML代码赋值给optgroup元素
  optgroup.innerHTML = optionsHTML;
</script>