Merging jQuery objects

Question

Is it possible to merge several jQuery DOM objects into one array and call jQuery methods on all of them?

F.ex:

<button>one</button> <h3>two</h3>  <script>  var btn = $('button'); var h3 = $('h3');  $([btn,h3]).hide();  </script> 

This doesn't work. I know I can use the 'button,h3' selector here but in some cases I already have several jQuery DOM elements and I need to merge them so I can call jQuery prototypes on all of them.

something like:

$.merge([btn,h3]).hide(); 

would work. Any ideas?

UPDATE:

Solved it. You can do it like this:

$.fn.add.call(btn,h3); 

I'm going to accept the add() suggestion as for pointing me in the right direction.

Answer 1

.add() does exactly what you're after.

h3.add(btn).hide(); 

If you wanted to make it a little more convenient for yourself, with a "merge" function like in your question, this could be added easily:

$.merge = function(objs) {     var ret = objs.shift();     while (objs.length) {         ret.add(objs.shift());     }     return ret; };  $.merge([h3, btn]).hide() 

Answer 2

$.map can flatten arrays:

function merge(array_of_jquery_objects) {     return $($.map(array_of_jquery_objects, function(el) {         return el.get();     })); }