'Headings in lists

I found this link How to semantically add heading to a list

And my problem is in this code:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <ol>
        <li>Pepsi</li>
        <li>Cola
            <ol type="a">
                <li>Drink1</li>
                <li>Drink2</li>
                <li>Drink3</li>
            </ol>
        
        </li>
        <li>Fanta</li>
    </ol>
</body>
</html>

I meant to put Cola as a Heading, but I don't know if it is right. I saw on the link that they say that its ok just to put heading over ol or ul, and to put it in a DIV if you want it all to be together just in case, but this is another matter because it is a list in a list. There is also a closing tag </li> after drinks, and it goes out OK, works just fine... So I don't know if it is correct, do I need a caption, or just put heading tags or what?

So tell me what is the proper way to put a name for the number 2 LI?



Sources

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

Source: Stack Overflow

Solution Source