当另一个div中没有​​数据时，如何拉伸附近div的大小

Question

我有两个div并排显示两个不同的内容。当任何这些内容不存在时，其他内容应该延伸到包装器的宽度。

我使用jquery完成了这个。

<div class="wrapper">
<div id="news" class="teaser">

</div>
<div id="events" class="teaser"> </div>
</div>

我的jquery是

if($('#event').html().length <= 0 )
{   
    $('#news').css('width' , '100%');
    $('#event').css('display' , 'none');
}
if ($('#news').html().length <= 0)
{
$('#event').css('width' , '100%');
 $('#news').css('display', 'none');
}
});

它适用于此，但页面加载时拉伸非常明显。有没有办法减少加载时间或任何其他方法来实现它。

感谢。