点击按钮增加一行li

1.点击class=btn的按钮增加一行<li><input type="text" class='input1'/></li>'

$('.btn').click(function () {
    $('ul').prepend('<li>+'<input type="text" class='input1'/>'+'</li>')
})

2.点击class=input1的输入框会为当前点击的增加class=input_on样式，并将其他的移除

$(function () {
    $('ul').on('click','#name,.input1',function () {
        $(".input1").removeClass("input_on");
        $(this).addClass("input_on")
    })
})

↑↑↑↑↑↑↑↑

事件委托：　利用冒泡的原理，把事件加到父级上，触发执行效果

示例：

 <ul>
    <li class="felix">felix</li>
    <li>fff</li>
    <li>fff</li>
</ul>

    $(document).ready(function(){
        //通过on()方法
        $('ul').on('click','#name,.felix',function(){
            console.log(this);
        });
        //未来追加的元素
        $('ul').append('<a id="name">relix</a>')
    })