Javascript 将左边框应用于jQuery bxSlider插件自动生成的第一个li元素

我正在寻找一种方法，只在第一个

li

上应用由jQuery bxSlider插件生成的左边框，该插件是“活动的”，即有一个

pager

类。这是bxSlider插件生成的输出：

<div class="bx-window" style="position:relative; overflow:hidden; width:969px;">
    <ul id="carousel_items" style="width: 999999px; position: relative; left: -323px;">
        <li style="width: 304px; float: left; list-style: none outside none; opacity: 1;">CONTENT IN HERE</li>
        <li class="pager" style="width: 304px; float: left; list-style: none outside none; opacity: 1;">CONTENT IN HERE</li>
        <!-- other LIs in here -->
    </ul>
</div>

此处的内容
这里的内容

---

我不想在所有元素上应用左边框1px，因为这会导致在连接元素上使用左边框2px，因为我也有右边框1px。

这似乎不起作用，我相信原因可能是因为标记是由jQuery bxSlider插件生成的。我认为这必须用jQuery而不是CSS来修改-我说的对吗？不，这是直接的CSS。您是否在bxSlider CSS声明之后插入此CSS？您正在测试哪个浏览器？

#carousel_items.li:first-child { border-left:1px solid red; }