JavaScript click event bug (probably)

Question

Got an annoying bug and have no idea what the problem is:

I hold global variable: var cur_id=0; When I click on textarea I want to save textarea's id value to cur_id:

$('textarea.line').click(function  () {
    cur_id = $(this).attr('id');
}); 

Now I want set cur_id to zero in case you click anywhere but not in content-append class element:

 $(document).on('click touchstart', function(event) { 
    var el = $(event.target);
    if (!el.hasClass('content-append')) {
        cur_id = 0;  
    };
});

Also, there is an action which removes the textarea I just clicked:

$('.main-remover').click(function () {
    if (cur_id==0) {alert('Click a textarea to remove it!');} 
            else {document.getElementById(cur_id).remove();
        cur_id = 0;}
});

When I click textarea and then click any place in document cur_id becomes zero. That's OK, but when I click textarea and then click this button:

<button type="button" class="content-append main-remover btn btn-default">Remove</button>

I get 'Click a textarea to remove it!' message, which should be shown only if cur_id==0 and it doesn't remove anything. I think that somehow I'm wrong in this part:

$(document).on('click touchstart', function(event) { 
        var el = $(event.target);
        if (!el.hasClass('content-append')) {
            cur_id = 0;  
        };
    });

Please, help me to figure out what's wrong!