JSFiddle - React, Tailwind, and code Playground
by 3leven11
HTML
<ul>
<li id="time_option-1" class="" style="display: none;">
<input type="radio" name="octime[]" id="OrderOrderCollectiondateTime0" value="1" disabled="disabled">
<label for="OrderOrderCollectiondateTime0" style="display: none;">8:00 AM - 9:00 AM</label>
</li>
<li id="time_option-2" class="list_enabled" style="display: block;">
<input type="radio" name="octime[]" id="OrderOrderCollectiondateTime1" value="2">
<label for="OrderOrderCollectiondateTime1" style="display: block;">9:00 AM - 10:00 AM</label>
</li>
<li id="time_option-3" class="" style="display: none;">
<input type="radio" name="octime[]" id="OrderOrderCollectiondateTime2" value="3" disabled="disabled">
<label for="OrderOrderCollectiondateTime2" style="display: none;">10:00 AM - 11:00 AM</label>
</li>
<li id="time_option-4" class="" style="display: none;">
<input type="radio" name="octime[]" id="OrderOrderCollectiondateTime3" value="4" disabled="disabled">
<label for="OrderOrderCollectiondateTime3" style="display: none;">11:00 AM - 12:00 PM</label>
</li>
<li id="time_option-5" class="list_enabled" style="display: block;">
<input type="radio" name="octime[]" id="OrderOrderCollectiondateTime4" value="5">
<label for="OrderOrderCollectiondateTime4" style="display: block;">12:00 PM - 1:00 PM</label>
</li>
<li id="time_option-6" class="list_enabled" style="display: block;">
<input type="radio" name="octime[]" id="OrderOrderCollectiondateTime5" value="6">
<label for="OrderOrderCollectiondateTime5" style="display: block;">1:00 PM - 2:00 PM</label>
</li>
</ul>
JavaScript
$(document).ready(function () {
$('.list_enabled:first input').attr('checked', 'checked');
});