Error when using function deleteRow after load ajax jquery?
===

    <a class="checkModelButton" href="check.php">Check</a>
    <div id="model_list"></div>

include jquery and function deleteRow():

    jQuery('.checkModelButton').click(function(event){
       event.preventDefault();
       var url = jQuery(this).attr('href');
       jQuery.ajax({
             type: 'get',
             cache: false,
             url: url,
             success: function(html){
                 jQuery('#model_list').html(html);
             }
       });
    });
    function deleteRow(id) {
        try {
            var table = document.getElementById('model_list');
            var rowCount = table.rows.length;
            for(var i=0; i<rowCount; i++) {
                var row = table.rows[i];
                var chkbox = row.cells[0].childNodes[0];
                if(null != chkbox && true == chkbox.checked) {
                    table.deleteRow(i);
                    rowCount--;
                    i--;
                }
            } 
            jQuery("input[type=checkbox]:checked").each(function() { 
                jQuery(this).parents("tr").remove(); 
            });    
             
        } catch(e) {
            alert(e);
        }
    }

in check.php return html is:

    <input type="button" value="Delete Row" onclick="deleteRow('model_list')" />
    <table id="model_list">
       <thead>
          <tr>
            <th>#</th>
            <th>Name</th>
          </tr>
       </thead> 
       <tbody>
          <tr>
            <td><input type="checkbox" value="1" name="model_id[]" class="item"></td>
            <td>Nokia N71</td>
          </tr>
       </tbody>
    </table>

After loadding ajax, I checked on form input and click button Delete Row, but error can't delete this row And error is `alert(Table model_list is empty)`, how to fix it ?