CheerioJS, looping through <ul> with same class name

Question

I'm trying to loop through each <ul> and get the value of each <li>. The thing is, it only takes the first <ul> and skips the rest.

HTML

<div id="browse-results">
    <ul class="tips cf">
        <li>tip11</li>
        <li>tip12</li>
        <li>tip13</li>
    </ul>
    <ul class="tips cf">
        <li>tip21</li>        
        <li>tip22</li>        
        <li>tip23</li>        
    </ul>
    <ul class="tips cf">
        <li>tip31</li>        
        <li>tip32</li>        
        <li>tip33</li>        
    </ul>
    <ul class="tips cf">
        <li>tip41</li>        
        <li>tip42</li>        
        <li>tip43</li>        
    </ul>
</div>

Cheerio Parsing

$('#browse-results').find('.tips.cf').each(function(i, elm) {
    console.log($(this).text()) // for testing do text() 
});

$('#browse-results').children().find('.tips').each(function(i, elm) {
    console.log($(this).text())
});
I've tried many more

The output is just the values of the first <ul>.

tip11
tip12
tip13

Please note guys that this is just a snippet example with the same structure of what I'm trying to parse.

I spent nearly 2 hours on this, and I can't find a way to do it.

Answer 1

Try this:

var cheerio = require('cheerio');

var html = '<div id="browse-results"> \
    <ul class="tips cf"> \
        <li>tip11</li> \
        <li>tip12</li> \
        <li>tip13</li> \
    </ul> \
    <ul class="tips cf"> \
        <li>tip21</li> \
        <li>tip22</li> \
        <li>tip23</li> \
    </ul> \
    <ul class="tips cf"> \
        <li>tip31</li> \
        <li>tip32</li> \
        <li>tip33</li> \
    </ul> \
    <ul class="tips cf"> \
        <li>tip41</li> \
        <li>tip42</li> \
        <li>tip43</li> \
    </ul> \
</div>';

var $ = cheerio.load(html);

$('#browse-results li').each(function(i, elm) {
    console.log($(this).text()) // for testing do text() 
});

This will select all li elements which are decedents of #browse-results.