jquery adding stripes to ul

Question

Hi I'm trying to make a function that will add a striped effect to an unordered list, I've got the following so far but cant work out how the selector should work.

    (function($) {
    $.fn.stripe = function(){
        this.$("li:even").css("background-color","#f00");
    };
    })(jQuery);


    $("list_id").stripe();

thnks

Answer 1

$(this).children('li:even').css("background-color","#f00");

Answer 2

As reko has said, the best way to implement this is using the pseudo odd and even. Try implementing it the same as the following:

JQuery

$(document).ready(function() {
    $("ul.formattedList:odd").addClass("oddItem");
    $("ul.formattedList:even").addClass("evenItem");
}

CSS

.formattedList .oddItem {
    background-color: Black;
    color: White;
}

.formattedList .evenItem {
    background-color: White;
    color: Black;
}

HTML

<ul class="formattedList">
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>
    <li>Item 4</li>
    <li>Item 5</li>
</ul>