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.
Try this:
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 descendants of #browse-results
.