JSFiddle - React, Tailwind, and code Playground
HTML
<select name="bloodsVaccinesTypesBloods" id="bloodsVaccinesTypesBloods" class="bloodsVaccinesDropdown bloodsVaccinesTestTypes bloodsVaccinesTypesBloods">
<optgroup label="Hepatitis B">
<option value="12" selected="selected">Antigen blood test</option>
<option value="13">Core antibody blood test</option>
<option value="10">Vaccine (course of 3 vaccines & 5 year booster)</option>
</optgroup>
<optgroup label="Hepatitis C">
<option value="14">Antibody blood test</option>
<option value="15">RNA blood test</option>
</optgroup>
</select>
JavaScript
$('#bloodsVaccinesTypesBloods').focusout(function(){
$('#bloodsVaccinesTypesBloods > optgroup').each(function() {
$(this).children().each(function() {
$(this).attr('label',$(this).parent().attr('label')+ ' - ' + $(this).text());
});
});
});
$('#bloodsVaccinesTypesBloods').focus(function(){
$('#bloodsVaccinesTypesBloods > optgroup').each(function() {
$(this).children().each(function() {
$(this).attr('label',$(this).text());
});
});
});