如何使用jquery选择父元素的兄弟？

Question

我正在尝试使用jquery来专门选择一个兄弟元素，它具有相同的父元素。代码是这样的：

HTML

    <div class="cool-check-list">
        <ul>
        <li>
            <label>
                <span class="icon"></span> <!-- trying to select this -->
                Awesome Label Name
            </label>

            <ul>
                <li>
                    <label>
                        <span class="icon"></span> <!-- clicking this toggles the class of the above icon class -->
                        Awesome Label Name 2
                    </label>    
                </li>                        
            </ul>
        </li>
        </ul>
   </div>

JQUERY

    $('.icon', '.cool-check-list').click( function(e){

    $(this).parent('li label .icon').toggleClass('icon-alternate');

    });

Answer 1

假设您已经获得了对点击范围的引用，您可以这样做：

$(this).closest("ul").siblings().find(".icon")

this是您点击的span。 closest获取与选择器匹配的最近祖先。

Answer 2

您应该更准确地告诉我们您想要选择的内容以及您尝试过的内容。

无论如何，您可以使用jquery的parents（）函数，例如：

$(".icon").parents("li")

将在'DOM中的类图标之前选择每个节点li'。

顺便说一句，请注意parents和parent之间的区别 - 引用jquery文档：

  

.parents（）和.parent（）方法   是相似的，除了后者   只运行DOM的单个级别   树。