如何为每个列表视图项目使用不同的背景色

<style>
    .item1 {
        background-color: #ff0000; /* 红色背景 */
    }
    .item2 {
        background-color: #00ff00; /* 绿色背景 */
    }
    .item3 {
        background-color: #0000ff; /* 蓝色背景 */
    }
</style>

<ul>
    <li class="item1">项目1</li>
    <li class="item2">项目2</li>
    <li class="item3">项目3</li>
</ul>

<ul>
    <li style="background-color: #ff0000;">项目1</li>
    <li style="background-color: #00ff00;">项目2</li>
    <li style="background-color: #0000ff;">项目3</li>
</ul>

<ul>
    <li>项目1</li>
    <li>项目2</li>
    <li>项目3</li>
</ul>

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
    $(document).ready(function() {
        $('li:eq(0)').css('background-color', '#ff0000'); /* 第一个项目红色背景 */
        $('li:eq(1)').css('background-color', '#00ff00'); /* 第二个项目绿色背景 */
        $('li:eq(2)').css('background-color', '#0000ff'); /* 第三个项目蓝色背景 */
    });
</script>