前項では子孫セレクタ（その中にあるすべての子要素）の設定をしました。
これは非常に便利なのですが
「子要素だけを設定して、孫要素以下は設定したくない」ということもたくさんあります。
先程も記しましたが、

<div id="danraku">
  <ul id="ichi">
    <li>箇条書き１</li>
    <li><a href="#">箇条書き２</a></li>
    <li>箇条書き３
      <ul id="ni">
        <li>こども１</li>
        <li><a href="#">こども２</a></li>
        <li>こども３</li>
      </ul>
    </li>
    <li>箇条書き４</li>
  </ul>
</div>

では、#danrakuの中に、子要素としてul#ichi（idがichiのul）があり、孫要素としてul#ni（idがniのul）があります。
今回は子要素のみを設定したいとしましょう。
この場合cssでは、

親要素名 > 子要素名 {
 設定
}

#danraku > ul {
 ....
}

と書き、jQueryでは、

$('親要素名 > 子要素名').メソッド

// 例
$('#danraku > ul').css {
   color: 'red',
} 

のように、親要素と子要素の間を「>」でつないであげます。

では、idがdanraku の子のul要素をボーダー(1px 実線 緑色)で囲んで見ましょう。孫は囲まないようにします。この場合は以下のjQueryとなります。

$('#danraku > ul').css('border','1px solid green');

①で設定されたulの部分だけに枠が入ったことがわかりますでしょうか。