JQuery найти все элементы DIV Chaild с родителем li

Question

Я пытаюсь найти все div с классом container
, которые являются прямым потомком li с классом row

В этом примере только 1и 2 - правильный div.
Не уверен, что я делаю неправильно, вот что я пробовал до сих пор:

console.log('using: li div');

$('li div').each(function(){
  console.log($(this).text());
});

console.log('using: div.container > li.row');

$('div.container > li.row').each(function(){
  console.log($(this).text());
});

console.log('using: div.container ~ li.row');

$('li.row ~ div.container').each(function(){
  console.log($(this).text());
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>


<ol>
<li class="row"><div class="container">1</div></li>
<li class="row"><div class="container">2</div></li>
<li class="OtherRow"><div class="container">3</div></li>
<li class="OtherRow"><div class="container">4</div></li>
<li class="OtherRow"><div class="container">5</div></li>
</ol>

<div class="container">5</div>

Answer 1

1. используйте > для прямого ребенка

$('li.row>div.container').css('color', 'red')

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>


<ol>
  <li class="row">
    <div class="container">1</div>
  </li>
  <li class="row">
    <div class="container">2</div>
  </li>
  <li class="OtherRow">
    <div class="container">3</div>
  </li>
  <li class="OtherRow">
    <div class="container">4</div>
  </li>
  <li class="OtherRow">
    <div class="container">5</div>
  </li>
</ol>

<div class="container">5</div>