I have a var which is an index of one of the divs above, lets say it equals 2, so it's the one with 3.jpg as a background.
...
Now, I'm trying to get the index of the next div with class "slide", which index is greater than my var and which has no "background" in "style".
What you need for that literal requirement is a combination of eq
, nextAll
, filter
, and (if you really want the index) index
.
var index = $(".slide").eq(startingIndex).nextAll(".slide").filter(function() {
return $(this).attr("style").indexOf("background") === -1;
}).index();
That will give you the element's index relative to its siblings (all of them).
But if you just want the element, use first
instead:
var nextSlideWithoutBackground = $(".slide").eq(startingIndex).nextAll(".slide").filter(function() {
return $(this).attr("style").indexOf("background") === -1;
}).first();
Actually, you could use :gt
but it's a pseudo-selector so it may not be any better than using nextAll
. Here's what it would look like, though:
var index = $(".slide:gt(" + startingIndex + ")").filter/*...and so on...*/