On checkbox list how do I only display the next unchecked item?

I have a series of checkboxes that are sorted in order of first item to the last item. What I want to do is only display the next item not yet checked. While I have 17 items now on the checklist, it may change up or down over time.

I have been playing with :nth-last-child, but I am unable to achieve what I want.

Here is an example of the HTML for the display of each checkbox item.

<div class="my-check-col-12">...</div>
<div class="my-check-col-12">
  <span class="fa-stack" style="">
    <i class="far fa-circle fa-stack-2x myc-text-type">
      ::before
    </i>
    <i class="fa-stack-1x fas fa-times myc-text-type">
    ::before
    </i>
  </span>
Item not complete</div>
<div class="my-check-col-12">...</div>

All help appreciated

Thanks