'Hide number in ordered list if there is only one element in the list

Say I have a ordered list like this.

<ol>
  <li>a</li>
<ol>

Since this ol only has one item, I want to render it as

a

On the other hand, if there are more than one item in the list like below, I want to render 1., 2.s.

<ol>
  <li>a</li>
  <li>b</li>
<ol>

should be

1. a
2. b

Is there a way to do this in pure CSS?



Solution 1:[1]

li:only-of-type { list-style-type: none; }
<h1>List 1</h1>
<ol>
  <li>Coffee</li>
  <li>Tea</li>
</ol>


<h1>List 2</h1>
<ol>
  <li>Coffee</li>
</ol>

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 sandeep.kgp