jQuery Hierarchy Selectors List Example

jQuery Hierarchy Selectors List Example

Today, We want to share with you jQuery Hierarchy Selectors List Example.
In this post we will show you jQuery Basic Selectors with Adding a class to even an odd List-Elements, hear for Basic and Hierarchy Selectors we will give you demo and example for implement.
In this post, we will learn about Complete List of jQuery Selectors with an example.

Jquery : Info : odd selector

The : odd selector can selects each the table row all td with an odd index like (odds)1, 3, 5, 7 … etc

0-based indexing in odd selector
:odd selector is a jquery extension data and not any part of the data element of CSS specification value.

$(“tr:odd”).css(“background-color”,”colorname/colorcode”); // like #ff0254

Jquery :Info : even selector

The :used even selector selects each table row with an even index like 0, 2, 4, 6, 8 etc
0-based indexing

:even is a jquery extension and not part of the CSS specification.

$(“tr:evan”).css(“background-color”,”colorname/colorcode”); // like #ff0254

Example of add or evan class add using jquery


Adding a class to evan and odd class of list-Elements


Add odd and evan class using jquery

  • jQuery :odd Selector – example – step by step
  • Jquery dynemically add , update and delete data
  • jquery Animation example with Source code
  • jquery validation with Example – step by step
  • jquery to ajax call – to get and post method call
  • jquery add class and jQuery remove class example
  • jquery to get id ,class and html tag
  • jquery tutorials point
  • jquery Basic top 10 demo with example
  • My first Application using core jquery and javascript
  • get all id and name using jquery

Solution of AngularJs All Problems For Pakainfo.com

My First Web-Application in angularjs, So I am very happy and 1000+ more then people are used of Pakainfo.com


Script : Add class : we can use : odd selector and :even selector


$(‘.carousel item:odd’).addClass(‘odd’);
$(‘.carousel item:even’).addClass(‘even’);


Example 2 :jQuery selectors for even and odd all rows in a table



ItemCode DebtorName
PONumber UOM
Rate Qty
Total subTotal
Discount Amount



$(“#sales-data > tbody > tr:odd”).addClass(“odd”);
$(“#sales-data > tbody > tr:not(.odd)”).addClass(“even”);



color: green;
background-color: yellow;

color: pink;
background-color: blue;


View Demo1
View Demo2
View Demo3

Leave a Comment