Question

<div class="nav-top">
<ul>
  <li class="tab1"><a href="/">test</a></li>
  <li class="tab2"><a href="#">test</a></li>
  <li class="tab3"><a href="#">test</a></li>
  <li class="navahead"><a href="#">test</a></li>
  <li class="navahead"><a href="#">test</a></li>
<li class="new"><a href="#">test</a></li>
</ul>
</div>

i want to only add onmouse over event to the first three li(tab1,tab2,tab3). how to write the if condition.

Answer 1

You don’t need an if – you can use the jQuery :lt() selector

$('ul li:lt(3)').mouseenter(function(){});

Note that the index is zero-based, so the first three are 0, 1 and 2

http://api.jquery.com/lt-selector/

Update July 2020:

As of jQuery 3.4, the :lt pseudo-class is deprecated. Remove it from your selectors and filter the results later using .slice(). For example, :lt(3) can be replaced with a call to .slice(0,3)