Q:

How do I use javascript or jquery to climb the DOM looking only at direct parents, but not uncles/aunts? 

I have a need to climb up the DOM tree to the parent, grandparent, great grandparent of a node, etc (without any of their siblings) and to set some properties.  I thought that a simple recursion running up the tree would do the trick, but I just can't get it to work.  I've tried lots of different things that seem logical, but javascript is not cooperating with me.  Can anyone help? 
Here's a JSFiddle showing a non-working version of what I'm trying to do:
http://jsfiddle.net/ry8ojoaj/
// This function should climb up the chain of parent 'group's (but not uncles or aunts)
// and set their 'group-things' to have a red background
var setParentChainText = function(node) {
    if (! node) { return; }

    node.css('background-color', 'red');

    var parent = node.closest('.group').first()

    if (node.hasClass('group-thing')) {
        parent = node.parents('.group').first()
    }
    var parentThing = parent.find('.group-thing').first();
    setParentChainText(parentThing);
}

$(function() {
    var theOne = $('.the-one');

    var parent = theOne.closest('.group');
    var parentThing = parent.find('.group-thing').first();

    var grandparent = parent.parents('.group').first();
    var grandparentThing = grandparent.find('.group-thing').first();

    // uncommenting these will color the "top thing" and "parent thing" red. 
    //parentThing.css('background-color','red');
    //grandparentThing.css('background-color','red');

    // This call alone should color the "top thing" and "parent thing" red, but it doesn't. 
    setParentChainText(theOne);
});

and the HTML for the example:
<div class="group">
    <div class="group-thing">top thing</div>

    <div class="group">
        <div class="group-thing">uncle thing</div>
        <div class="item">
            <div class="child-thing">item</div>
            <div class="child-other">other</div>
        </div>
        <div class="item">
            <div class="child-thing">item</div>
            <div class="child-other">other</div>
        </div>
        <div class="item">
            <div class="child-thing">item</div>
            <div class="child-other">other</div>
        </div>
    </div>
    <div class="group">
        <div class="group-thing">parent thing</div>
        <div class="item">
            <div class="child-thing the-one">The One</div>
            <div class="child-other">other</div>
        </div>
        <div class="item">
            <div class="child-thing">item</div>
            <div class="child-other">other</div>
        </div>
        <div class="item">
            <div class="child-thing">item</div>
            <div class="child-other">other</div>
        </div>
    </div>
    <div class="group">
        <div class="group-thing">uncle thing</div>
        <div class="item">
            <div class="child-thing">item</div>
            <div class="child-other">other</div>
        </div>
        <div class="item">
            <div class="child-thing">item</div>
            <div class="child-other">other</div>
        </div>
        <div class="item">
            <div class="child-thing">item</div>
            <div class="child-other">other</div>
        </div>
    </div>
</div>

A:

The following code was what was getting you stuck:
if (node.hasClass('group-thing')) {
parent = node.parents('.group').first()
}

That just finds the same "group" parent again and stays within the first group over and over again.  
Change to: 
    var parent = node.hasClass('group-thing') ?  node.parent().parent() : node.closest('.group');
Here is my fiddle: 
http://jsfiddle.net/nhmaggiej/wtdsa5cq/

