How can I use jQuery find() with a depth limit?

For more complexe filtering than your current example, you should use filter. Here, this do the trick:

$('#tab_0').find('.field_container').filter(function(){return $(this).parent()[0].id === "form_content"}).each(function(){...});

There are several possibilities to solve this.

A rather quick one is:

$('#tab_0').children('#form_content').children('.field_container')

due to it's restriction of only traversing one level into the DOM tree each. I'm not entirely sure but this should be quicker (but in every case simpler) than a find() with a complex selector.


Is the nesting consistent? If so you can do this:

$('#tab_0').find('#form_content > .field_container');

If not you can do this (although it's less efficient):

$('#tab_0').find('.field_container:not(.field_container .field_container)');

Tags:

Jquery

Find

Depth