How to select multiple elements in jQuery

Well, we all know how to select a single element in jQuery.

$(document).ready(function(){      
  $("p").css('color','#FF0000'); 
});

But what if you come across a situation where you needs to apply some common functionality to multiple element. For example, you have couple of P tags, h1 tags and input boxes. You want to set their color to Red. One way is to write multiple statements to solve your purpose.

$(document).ready(function(){      
  $("p").css('color','#FF0000'); 
  $("h1").css('color','#FF0000'); 
  $("input[type=text]").css('color','#FF0000'); 
});

Today I will show you a tip/trick to select multiple elements in a single statement.

$(document).ready(function(){
  $("p,h1,input[type=text]").css('color','#FF0000');
});

This is really useful.Seperating the selectors with comma will allow us to select multiple element. I really love this. Short and sweet.

See live Demo and Code

Feel free to contact me for any help related to jQuery. I will gladly help you.



Responsive Menu
Add more content here...