In the last topic, we have seen the use of ":even" to apply changes to even occurrences of any element, now lets look one another selector ":odd" to select odd occurrences of the element:
$("li:odd")
The above line selects the odd list items. This can be understood by the following example:
<!--program starts-->
<html>
<head>
<script type='text/javascript'>
$("li:even").css("color","#0f0"); //makes the odd li items green in color
$("li:even").css("color","#f00"); //makes the even li items red in color
</script>
</head>
<body>
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
</ul>
</body>
</html>
<!--program ends-->
So the above program changes the color of content or text of the odd list items into "green".
Means it shows the numbers 1,3, and 5 in green color and 2,4,and 6 in red color(i.e. even numbers).
It affects all odd and even li tag content of our page and helps us to make the list items more visual appealing.
This selector is very powerful and mostly used when we want to make changes to the "tr" tags in a table to show difference between the table rows.
So now you can have alternate colors of table rows with just one or two lines of code. Now imagine the power of "do more, write less" library of javascript i.e. jQuery.
