How Delete dynamically generated button?

Hello, I am generating buttons to contain entries from a database, and would like to delete them on click my code deletes the entry from the db but I am unable to find a way to delete the actual button of the screen!

var db = Ti.Database.open('tournaments');
    var rows = db.execute('SELECT * FROM tournaments');
 
    var tournament = [];
    var delete_tournament = [];
    var id = [];
    var i = 0;
    while(rows.isValidRow()){
        var name = rows.fieldByName('name');
        var id = rows.fieldByName('id');
        id[i] = id;
       tournament[i] = Ti.UI.createButton({
       title: name,
       //top: 15,
       width: '84%',
       height: 70,
        });
        wrapper.add(tournament[i]);
        tournament[i].addEventListener('click', function(){
            var subject = tournament[i].title;
            alert(subject);
        });
 
        delete_tournament[i] = Ti.UI.createButton({
           title: 'x',
           //top: 15,
           width: '15%',
           height: 65,
           backgroundColor: 'red',
        });
        wrapper.add(delete_tournament[i]);
        delete_tournament[i].addEventListener('click', function(){
           // db.execute('DELETE FROM tournaments WHERE id=?',id);
            db.execute('DELETE FROM teams WHERE t_id=?',id);
            db.execute('DELETE FROM matches WHERE t_id=?',id);
            delete_tournament[i].setVisible(false);
            alert('deleted');
        });
        i++;
        rows.next();