Question

I am trying to use jquery to specifically select a sibling a parent element that has the same . the code is like this:

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

Assuming you’ve already gotten a reference to the clicked span, you could do this:

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

Where this is the span you clicked. closest gets the nearest ancestor that matches the selector.