How do I can add same chart content in two hidden tabs of a portlet?

<div class="row">
<div class="col-md-12">
<!-- BEGIN TAB PORTLET-->
<div class="portlet box green tabbable">
<div class="portlet-title">
<div class="caption">Strength</div>
</div>
<div class="portlet-body">
<div class=" portlet-tabs">
<ul class="nav nav-tabs">
<li>Tab 4</li>
<li >Tab 3</li>
<li>Tab 2</li>
<li class="active">Tab 1</li>
</ul>
<div class="tab-content">
<div class="tab-pane active " id="portlet_tab1">
<div class="row" >
<div class="col-md-6">

Teaching Staff Strength: 850

</div>

</div>
<div class="row">
<div class="col-md-6">

<div id="pie_chart_6" class="chart" style="padding: 0px; position: relative;">
</div>
</div>
<div class="col-md-6">
<table> <tr ><td >Total Strength</td><td>: 3500 </td></tr>
<tr><td >Students</td><td >: 2050 </td></tr>
<tr><td >Teaching Staff</td><td >: 800 </td></tr>
<tr><td >Non - Teaching Staff</td><td>: 650</td></tr>

</table>
</div>
</div>
</div>
<div class="tab-pane" id="portlet_tab2">
<div class="table-responsive">
<table class="table table-bordered table-hover">
<thead>
<tr>
<th>#</th>
<th>First Name</th>
<th>Last Name</th>
<th >Username</th>
<th>Status</th>
</tr>
</thead>
<tbody>
<tr>
<td rowspan="2">1</td>
<td>Mark</td>
<td>Otto</td>
<td >makr124</td>
<td><span class="label label-sm label-success">Approved</span></td>
</tr>
<tr>
<td>Jacob</td>
<td>Nilson</td>
<td >jac123</td>
<td><span class="label label-sm label-info">Pending</span></td>
</tr>
<tr>
<td>2</td>
<td>Larry</td>
<td>Cooper</td>
<td >lar</td>
<td><span class="label label-sm label-warning">Suspended</span></td>
</tr>
<tr>
<td>3</td>
<td>Sandy</td>
<td>Lim</td>
<td >sanlim</td>
<td><span class="label label-sm label-danger">Blocked</span></td>
</tr>
</tbody>
</table>
</div>

</div>
<div class="tab-pane " id="portlet_tab3">
<div class="row">
<div class="col-md-6">

Teaching Staff Strength: 850

</div>
</div>
<div class="row">
<div class="col-md-6">

<div id="donut" class="chart" style="padding: 0px; position: relative;"></div>
</div>
<div class="col-md-6">
<div class="table-responsive">
<table class="table table-bordered table-hover">
<thead>
<tr>
<th>subject</th>
<th>Count</th>

</tr>
</thead>
<tbody>
<tr>
<td >1</td>
<td>Mark</td>

</tr>
<tr>
<td>2</td>
<td>Jacob</td>

</tr>
<tr>
<td>2</td>
<td>Larry</td>

</tr>
<tr>
<td>3</td>
<td>Sandy</td>

</tr>

</tbody>
</table>

</div>
<div class="col-md-7 col-sm-12">
<div class="dataTables_paginate paging_bootstrap">
<ul class="pagination"><li class="prev disabled">
</li>
<li class="active">1</li><li>2</li>
<li>3</li><li>4</li>
<li>5</li>
<li class="next"></li>

</ul></div>

</div>
</div>
</div>
</div>

<div class="tab-pane" id="portlet_tab4">
<div class="row">
<div class="col-md-6">

Teaching Staff Strength: 850

</div>
</div>
<div class="row">
<div class="col-md-6">
<div id="donut1" class="chart" style="padding: 0px; position: relative;"></div>
</div>
<div class="col-md-6">
<div class="table-responsive">
<table class="table table-bordered table-hover">
<thead>
<tr>
<th>subject</th>
<th>Count</th>

</tr>
</thead>
<tbody>
<tr>
<td >1</td>
<td>Mark</td>

</tr>
<tr>
<td>2</td>
<td>Jacob</td>

</tr>
<tr>
<td>2</td>
<td>Larry</td>

</tr>
<tr>
<td>3</td>
<td>Sandy</td>

</tr>

</tbody>
</table>

</div>
<div class="col-md-7 col-sm-12">
<div class="dataTables_paginate paging_bootstrap">
&

here 3 & 4 tabs have same chart it is not displaying in 4th tab