指定した番号より小さいインデックス番号の要素を選択$(":lt(インデックス番号)")ver1.0〜$(":lt(負のインデックス番号)")ver1.8〜※:(コロン)を忘れないように注意しましょう※インデックス番号は0から始まることに注意。機能:(コロン)に続けてltを設定し、引数としてインデックス番号を指定すると指定したインデックス番号より小さい要素を選択します。このときインデックス番号は0から始まることに注意してください。ver1.8からは負のインデックス番号を指定することで、最後の要素から数えた要素を選択できるようになりました。この場合インデックス番号は-1から始まります。指定した番号より小さいインデックス番号の要素を選択しますサンプル(lt/01.html)を開いてbody内にdiv要素が6つあることを確認してください。複数のセレクタ(and)を利用してdiv要素と組みあわせました。そのためbuttonをクリックするとインデックス番号が2より小さいdiv要素を選択します(引数で指定した2番目の要素は含まないことに注意)。cssメソッドを利用して背景色を緑にします。$("button").click(function(){$("div:lt(2)").css("background-color","#9f9");});ページ全体を通してのインデックス番号ですインデックス番号はページを通して連番になっていることの注意してください。サンプル(lt/02.html)を開いてbody内にol要素とul要素の2つのリストがあることを確認して下さい。各リストにはli要素が5つづつあります。jQueryは以下の様に記述され、buttonをクリックするとインデックス番号が7より小さいli要素を選択します。cssメソッドを利用して背景色をピンクに変更します。$("button").click(function(){$("li:lt(7)").css("background-color","#FCC");});ul要素とol要素は異なるリストですが、li要素は共通のためul要素/ol要素を通して連続したインデックス番号が設定されます。その結果、buttonをクリックするとol要素の全てとul要素の上2つのli要素が選択されます。>(子要素)を利用します。サンプル(lt/03.html)を開いてbody内の構成がlt/02.htmlと同じ事を確認してください。>(子要素)が追加されul要素内のインデックス番号が2より小さいli要素を選択するようにしました。$("button").click(function(){$("ul>li:lt(2)").css("background-color","#FCC");});結果として、buttonをクリックするとul要素内の上2つのli要素が選択されます。サンプルlt/03.htmlではul要素内にli要素しかないので、li要素の記述は省略しても同じです。サンプル(lt/03b.html)を開いてjQueryが以下の様に変更されていることを確認して下さい。選択される要素はサンプルlt/03.htmlと同じになります。$("button").click(function(){$("ul>:lt(2)").css("background-color","#FCC");});負のインデックス番号も利用できますv1.8から負のインデックス番号が利用できるようになりました。サンプル(lt/04.html)を開いてbody内の構成がlt/01.htmlと同じ事を確認してください。jQueryは以下の様にセレクタltの引数に-2が設定されています。結果としてbuttonをクリックすると最後から2番目より前の(インデックス番号が少ない)div要素が選択されます(引数に指定した最後から2番目の要素は含みません)。