Remove border-spacing when there is no data in a table

Remove border-spacing when there is no data in a table

I have an issue related to vertical whitespace in a table. I'm using the
border-spacing CSS property to add some space between the table rows (to
make them appear less-crammed).
Data is added dynamically in the table, so there can be the situation in
which I have no data in the table (no trs) but there is some vertical
whitespace due to the border-spacing property (which is currently
border-spacing: 0px 10px).
Is there a possibility to fix this through CSS?
Fiddle example with data: http://jsfiddle.net/lav911/QLsah/
Fiddle example without data: http://jsfiddle.net/lav911/yWRS7/
I mention that the intended functionality would be not to display the
table at all when there is no data in it.