Q: add lists classes differently by looping I have the following html...
<div id="banner">
    <ul>
        <li>one</li>
        <li>two</li>
        <li>three</li>
    </ul> 
</div>

And applied the following jquery:
$('#banner li:nth-child(1)').addClass('li1');
$('#banner li:nth-child(2)').addClass('li2');
$('#banner li:nth-child(3)').addClass('li3');

But I think this would be done easily as using for loop but can't get an idea on this. Could anyone please help me on this?

A: Try the addClass() variant that takes a function as argument
$('#banner li').addClass(function(idx){
    return 'li' + (idx + 1)
})

Demo: Fiddle

A: .each()
.addclass()
$('#banner li').each(function(i){
    $(this).addClass('li'+parseInt(++i));
});

DEMO
