Add new tags can not trigger

Similar to our mobile phone app is a lot of features added to delete my applications, such as:

The above - is delete class below + is add class if to delete and add added directly click click event there will be a effect that click - No. apply to all applications following in my application click - to add to all the applications in this application then point + + will not trigger the click click event so for this event we need to bind to the document, for example:

function addfun(mythis){
    mythis.parent().hide()
    mythis.removeClass('add')
    mythis.addClass('delete')
    var a = '<li>'+ mythis.parent().html() + '</li>'
    $('.conter1 ul').append(a)
    return false
}
function delfun(mythis){
    mythis.parent('li').hide()
    mythis.removeClass('delete')
    mythis.addClass('add')
    var a = '<li>'+ mythis.parent().html() + '</li>'
    $('.conter2 ul').append(a)
    return false
}
// document
$(document).on('click','.add', function(event){
    addfun($(this))
}); 
$(document).on('click','.delete', function(event) {
    delfun($(this))
});