JQuery Select eq lt gt not

From CoderLearner
Jump to: navigation, search

Use equal, less than, greater than, and not

You can use eq(), gt(), lt(), and not() for comparison.

List elements

<ul>
	<li>One</li>
	<li>Two</li>
	<li>Three</li>
	<li>Four</li>
	<li>Five</li>
	<li>Six</li>
	<li>Seven</li>
	<li>Eight</li>
	<li>Nine</li>
</ul>

Example 1: eq(Index)

  • Index start from 0
  • Three is blue
$('ul li:eq(2)').css('color','blue');

Example 2:lt(Number)

  • List all element that less than index 2 (Index 0=One, and Index 1=Two)
  • List: one and two.
$('ul li:lt(2)').css('color','blue');

Example 3:gt(Number)

  • List all UL elements that greater than index 5
  • List: seven, eight, and nine.
$('ul li:gt(5)').css('color','red');

Example 4:not(sector)

  • Display all elements that does not contain the class=last
$('ul li:not(.last)').css('color','red');

<ul>
    <li class="last">One</li>
    <li class="last">Two</li>
    <li class="last">Three</li>
    <li class="last">Four</li>
    <li class="first">Five</li> <!-- display --->
    <li class="last">Six</li> 
    <li class="last">Seven</li>
    <li class="last">Eight</li>
    <li class="last">Nine</li>
</ul>


<seo metagenerator="jquery tutorial" title="Jquery/Ajax" metakeywords="jquery greater,jquery gt, jquery lt, less then, odd jquery,jquery find element, even jquery,jquery event, jquery mouse click, jquery double click, jquery hover, jquery string, jquery array, jquery button, jquery attriubtes" metadescription="jquery button, jquery attriubte, jquery example, jquery tutorial, jquery sample"/>