jquery validate errorPlacement wrapInner errorElement

I have a problem with errorPlacement. I have a table and I want to display errors after tr which has input with invalid value. Error shoud be inside tr and td, to properly display. I'm trying to wrap the error element(tr) by td and it works but only once. I enter invalid value, then get error in tr and td (correct), then I enter valid value and again invalid and then error element is inserted only to tr. Td does not appear.
Here's my jquery code:

 if ($('.predict_score').length > 0) {
        var $predict_score_form = $('#predict_score_form');
        $predict_score_form.validate({
            errorPlacement: function(error, element) {
                error.insertAfter(element.parent().parent());
                error.wrapInner('<td colspan=100%>');
            },
            errorElement: 'tr'
        }); 

        $('.team_score_field').each(function() {
            $(this).rules('add', {
                digits: true
            });
        });
    }

and html:

<div class="predict_score">
  <form id ="predict_score_form" action="" method='post'>
<table>
    <thead>
        <tr>
            <th>&nbsp;</th><th>&nbsp;</th><th>&nbsp;</th><th>&nbsp;</th><th>&nbsp;</th><th>&nbsp;</th>
            </tr>
    </thead>
    <tbody>    
        <tr>
            <td >    <span>11.09.2013 13:30</span></td>
            <td >
                Reading FC                                        </td>
            <td>

                <input type="text" value="" name="">
                <strong>:</strong>
                <input type="text" value="" name="">

            </td>    
            <td>
                Stoke City                                        </td>
            <td>-:-</td>
            <td class="right"></td>
        </tr>        
        <tr>
            <td >    <span>11.09.2013 00:00</span></td>
            <td >
                Toronto FC                                        </td>
            <td >    
                <input class="team_score_field" type="text" value="" disabled="disabled" name="">
                <strong>:</strong>
                <input class="team_score_field" type="text" value="" disabled="disabled" name="">    
            </td>    
            <td>
                Chicago Fire                                        </td>
            <td>-:-</td>
            <td class="right"></td>
        </tr>     
        <tr><td colspan="100%"><input type="submit" value="" class="green_btn"></td></tr>
    </tbody>
</table>
  </form>
</div>

Any suggestions how to fix this?

Try

var $predict_score_form = $('#predict_score_form');
$predict_score_form.validate({
    errorPlacement: function(error, element) {
        error.find('td').attr('colspan', '100%')
        var $etr = error.closest('tr');
        $etr.insertAfter(element.closest('tr'));
    },
    errorElement: 'td',
    wrapper: 'tr',
    submitHandler: function(){
        return false;
    }
}); 

Demo: Fiddle