jQuery-直系子代

我有这样的结构:

<ul id="mycustomid">
    <li><a>Item A</a>
        <ul class="children">
           <li><a>Child1 of A</a>
               <ul class="children">
                 <li><a>Grandchild of A</a>
                    <ul class="children">
                       <li><a>Grand Grand child of A</a></li>
                    </ul>
                </li>
               </ul>
           </li>
        </ul>
    </li>
    <li><a>Item B</a></li>
    <li><a>Item C</a></li>
</ul>

现在，我正在使用Jquery来获取ul#mycustomid的直接子代。但是我的代码返回了结构中所有li的信息。我应该如何进行？
这是我的代码:

$(document).ready(function() {
 var arri = $("#mycustomid>li").text();
 alert(arri);
});

我也尝试过.children()，它给了我几乎相同的结果。这真的让我感到不安:(
我的警报框的输出完全如下图所示(包括那些空白):

Item A
Child1 of A
Grandchild of A

Grand Grandchild of A


ItemBItemC

而它应该是正好(无空格):

Item A
Item B
Item C

要了解我的问题，您可以在https://jsfiddle.net/yS6ZJ/查看实时版本
请指出正确的方向。

最佳答案

我认为您的选择器工作得很好-这是您在使用它的问题。

调用.text()时，您将获得该元素的所有内容。所有这些，包括子元素。

试试这个:

$('#mycustomid > li').each(function() {
  alert($(this).find('a:eq(0)').text());
});

关于jQuery-直系子代，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/3166049/