Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to group jquery objects to apply css together? [duplicate]

Tags:

jquery

Say I have a function that accepts multiple jQuery objects:

workWithThreeObjs($('.content'),
                  $('h1'),
                  $('input[type=button]'));

I define my function like this:

function workWithThreeObjs(p, h1, buttons) {
    ...
}

Inside this function, I want to apply border to all of them like this

$(p, h1, buttons).css(...);

How do I do that? Right now it only applies to p.

My function code does not control what is passed into it, so I cannot change the selectors used to create the arguments. I must operate only on the jQuery objects provided.

like image 702
Muhammad Umer Avatar asked Jun 03 '15 18:06

Muhammad Umer


2 Answers

Assuming that you want to use variables

Use $.fn.add()

Create a new jQuery object with elements added to the set of matched elements.

var p = $('.content'),
    h1 = $('h1'),
    buttons = $('input[type=button]');

p.add(h1).add(buttons).css({})

DEMO

like image 186
Satpal Avatar answered Nov 22 '22 16:11

Satpal


var p = $('.content'),
        h1 = $('h1'),
        buttons = $('input[type=button]');

function workAnyNumberofObjects() {
  for(var i=0; i<arguments.length; i++){
    arguments[i].css('border', '1px solid blue')
  }
}

workAnyNumberofObjects(p,h1,buttons);

You should be able to use any number of selectors here

like image 26
leapin_leprechaun Avatar answered Nov 22 '22 15:11

leapin_leprechaun