ソースコード
eqメソッドでインデックスを指定して要素を選択します。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> </head> <body> <h2>セリーグ</h2> <ol id="central"><li>中日</li><li>阪神</li><li>巨人</li><li>ヤクルト</li><li>広島</li><li>横浜</li></ol> <h2>パリーグ</h2> <ol id="pacific"><li>ソフトバンク</li><li>西武</li><li>ロッテ</li><li>日本ハム</li><li>オリックス</li><li>楽天</li></ol> </body> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script> <script type="text/javascript"> (function($) { $(document).ready(function () { // ３位までクライマックスシリーズに出場できる $("ol#central > li").eq(2).css("border-bottom", "1px solid #000000"); $("ol#pacific > li").eq(2).css("border-bottom", "1px solid #000000"); }) })(jQuery); </script> </html>
実行結果
functionにしてみた
<script type="text/javascript"> (function ($) { $(document).ready(function () { drawSeparate("central"); drawSeparate("pacific"); }) function drawSeparate(id) { $("ol#" + id + " > li").eq(2).css("border-bottom", "1px solid #000000"); }; })(jQuery); </script> </html>