Question

This works…

    var start = $('.nodes:first>span>div');
    var foo1 = $(".nodes:first>span>div>div>div>div>span>div");
    var foo2 = $(".nodes:first>span>div>div>div>div>span>div>div>div>div>span>div");
    var foo3 = $(".nodes:first>span>div>div>div>div>span>div>div>div>div>span>div>div>div>div>span>div");
    var foo4 = etc,etc...

Trying to consolidate to something like this…

    var start = $('.nodes:first>span>div');
    var separator = ">div>div>div>span>div";
    var foo1 = $("start + 1*separator");
    var foo2 = $("start + 2*separator");
    var foo3 = $("start + 3*separator");
    var foo4 = etc,etc...

Have been muddling for hours, but the syntax for this escapes me! Any pointers? Thanks!

Answer 1

Selectors are just strings so you just add strings to together and use them as a selector.

var start = '.nodes:first>span>div';
var separator = ">div>div>div>span>div";
var foo1 = $(start + separator);
var foo2 = $(start + separator + separator);
var foo3 = $(start + separator + separator + separator);

Though, if we understood what you were trying to accomplish, there is probably a much nicer way of doing it using less complication. For example, you should probably be using classes on the different types of divs and spans and then target specific classes without regard for how many intervening layers of divs there are. This makes your code much, much less brittle and much less tied to the exact HTML implementation (it still has some dependencies, but not near as many).

FYI, as far as I know, you can’t multiply strings to get multiple copies of them so 2*str doesn’t get you a string with two consecutive copies of str in it.