以下是使用forEach的版本

const sel = document.querySelector('.first-conditional-step');
const opts = [...sel.options].slice(1)
sel.options.length = 1; // keep the please select
let saveDt = "";
const optsInGroup = []
opts.forEach((opt,i) => {
  const type = opt.dataset.type;
  if (type !== saveDt) {
    if(i > 0) optsInGroup.push('</optgroup>')
    optsInGroup.push(`<optgroup label="${type}">`);
    saveDt = type;
  }
  optsInGroup.push(opt.outerHTML);
})
sel.innerHTML += optsInGroup.join('');

<select class="first-conditional-step col-3" style="height: 35px;">
  <option style="font-size: 10px" value="0">Select an element</option>
  <option value="410090" data-type="Dropdown Menu">Title</option>
  <option value="750978" data-type="checkbox">option#11</option>
  <option value="751330" data-type="checkbox">option#22</option>
  <option value="751331" data-type="checkbox">option#33</option>
  <option value="751269" data-type="checkbox">b1</option>
  <option value="751270" data-type="checkbox">b2</option>
  <option value="751271" data-type="checkbox">b3</option>
  <option value="751273" data-type="checkbox">Name</option>
  <option value="751274" data-type="checkbox">Name</option>
  <option value="751275" data-type="checkbox">Name</option>
  <option value="751293" data-type="checkbox">Image1</option>
  <option value="751294" data-type="checkbox">Image2</option>
  <option value="751295" data-type="checkbox">Image3</option>
  <option value="751271" data-type="quantity box">QTY tooltip</option>
  <option value="751273" data-type="slider">Slider Tooltip</option>
  <option value="751328" data-type="checkbox">Name</option>
  <option value="751329" data-type="checkbox">Name</option>
  <option value="751274" data-type="slider"></option>
  <option value="751275" data-type="quantity box"></option>
</select>