Merge two jQuery Objects

Question

I like to have a return value with one or more jQuery objects to add them to a .

var f = function() {
    var a = $('<div class="a" />');
    // do someting awesome
    return a;
};

Correct example with two s:

var f = function() {
    var ret = $('<div class="a" /><div class="b" />');
    // do something spectecular
    return ret;
};

The problem is that I need these two objects separated inside the function and this is not correct code:

var f = function() {
    var a = $('<div class="a" />'),
        b = $('<div class="b" />'),
        ret = a+b;
    // do something fabulous
    return ret;
}

why not just do $('div.a, div.b').each(function() {. inside the each function, $(this) refer to the current jquery object — Jeff Shaver
– Jeff Shaver, Commented Mar 28, 2013 at 11:10

James Allardice · Accepted Answer · 2013-03-28 11:08:49Z

13

You can use the jQuery .add() method:

return a.add(b);

From the docs:

Given a jQuery object that represents a set of DOM elements, the .add() method constructs a new jQuery object from the union of those elements and the ones passed into the method.

answered Mar 28, 2013 at 11:08

James Allardice

166k22 gold badges335 silver badges316 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

iRaS Over a year ago

damn shit. thats too easy - i just didn't find this method :)

James Allardice Over a year ago

@iRaS - Yup, very easy! The jQuery docs is a good place to start... I would recommend you spend an hour or so reading through them.

iRaS Over a year ago

you are absolutely right. I read a lot in the documentation. It's the last way to post a question. But I thought it's an object with array structured items so I tried extend() and merge() and read the documentation about read and merge. That doesn't helped me and there is no reference to add()..

iRaS · Accepted Answer · 2013-03-28 11:09:36Z

0

I just found a solution for my own question:

var f = function() {
    var a = $('<div class="a" />'),
        b = $('<div class="b" />'),
        ret = $.extend({}, a);
    ret.push(b[0]);
    // do something fabulous
    return ret;
}

Maybe you have better solutions? It doesn't look very well you know.

answered Mar 28, 2013 at 11:09

iRaS

2,2061 gold badge18 silver badges29 bronze badges

Comments

TazGPL · Accepted Answer · 2017-04-12 13:19:42Z

0

Check this out:

var $bindDivs = $.merge( $( '#div1' ), $( '#div2' ) );

edited Apr 12, 2017 at 13:19

TazGPL

3,7442 gold badges41 silver badges60 bronze badges

answered Apr 12, 2017 at 12:56

Anderson Souza

1

3 Comments

Mazz Over a year ago

Please explain your answer

Anderson Souza Over a year ago

@Mazz I really think it's pretty straightforward. I'm just using the jQuery.merge to unificate the two objects in one. I've tested it and it works pretty well. I use it myself.

Mazz Over a year ago

Nonetheless you should always explain your answers

Collectives™ on Stack Overflow

Merge two jQuery Objects

3 Answers 3

3 Comments

Comments

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

3 Comments

Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related