Edit in JSFiddle

$("document").ready(function(){
    $("ul li").click(function(){
        var index = $("ul li").index(this);
        index += (5 - index % 5);
        $("ul li").text(index); 
    });
});

<ul class="target">
    <li>aaa</li>
    <li>aaa</li>
    <li>aaa</li>
    <li>aaa</li>
    <li>aaa</li>
    <li>aaa</li>
    <li>aaa</li>
    <li>aaa</li>
    <li>aaa</li>
    <li>aaa</li>
    <li>aaa</li>
    <li>aaa</li>
    <li>aaa</li>
    <li>aaa</li>
    <li>aaa</li>
    <li>aaa</li>
    <li>aaa</li>
    <li>aaa</li>
    <li>aaa</li>
    <li>aaa</li>
    <li>aaa</li>
    <li>aaa</li>
    <li>aaa</li>
    <li>aaa</li>
    <li>aaa</li>
</ul>

ul li {
    float:left;
    margin-left: auto;
    margin-right: auto;
    padding: 10px 20px;
    text-align: center;
    display: block;
}

ul.target li:nth-child(5n+1) {
    clear: both;
}

ul.target li:nth-child(2n+2) {
    background: lightgrey;
}