Hide cached objects in jQuery

I'm not sure if "c开发者_如何学Cached" is a correct term for this one. Maybe I should use "instantiated" instead. However, say I want to "cache" several objects, to save some resources:

var $foo = $("#foo"),
$bar = $("#bar");

Now, if I want to hide them, can I use a one-liner instead of:

$foo.hide();
$bar.hide();

I reckon that this one is quite simple (read: "stupid"), but hey... I can't figure it out all by myself...

You can also use .add() to roll up a bunch of jQuery objects and selectors:

$foo.add( $bar ).add('.someclass').add( $other_objects_or_selectors ).hide();

you can use something like this:

$.each([$foo, $bar], function(i, v) { 
  v.hide(); 
});

You can have multiple selectors in jQuery separated with comma:

$("#foo, #bar").hide();

If you're doing this for many id's, maybe do something like:

items = ['foo', 'bar'];
cache = {};
$.each(items, function(i,key) {
    cache[key] = $('#' + key);
    cache[key].hide();
});

Then later on access the 'cache' like cache['foo'].

Define a class for all these elements and then hide by the class

$('#foo').addClass('toHide'); 
//Later
$('.toHide').filter(':visible').hide();