Find Parent
HTML
<div class="yo" style="width:100%">
<div class="no" style="width: 50%">
<a href="#" id="make-red">Make 100 red</a>
</div>
</div>
<div class="yo">
Should Not Change
</div>
CSS
.red{background: yellow}
JavaScript
$(function() {
$('#make-red').click(function() {
$(this).parent().parent('.yo').addClass('red');
});
});
jQuery.fn.findParent = function (selector) {
var curParent = this.parent();
var curParentWithSelector = this.parent(selector);
var curO = curParent;
while (curParentWithSelector.length === 0) {
curParent = curO.parent();
curParentWithSelector = curO.parent(selector);
if (curParent.is('body')) return this.parent(selector);
if (curParentWithSelector.length === 1) return curParentWithSelector;
}
}