jquery event delegate

by basecss

HTML

<ul id="delegate">
    <li>delegate 1</li>
    <li>delegate 2</li>
</ul>
<ul id="on">
    <li>on 1</li>
    <li>on 2</li>
</ul>
<script src="http://code.jquery.com/jquery-1.9.0.min.js"></script>

CSS

#delegate li.class {
    border: 1px solid #C00;
}
#on li.class {
    background: #eee;
}

JavaScript

$(function(){
    
    $('#delegate').delegate('li', 'click', function(){
        
        $(this).toggleClass('class');
        
    });
    
    $('#on').on('click', 'li', function(){
        
        $(this).toggleClass('class');
        
    });
    
});