[Vaska]

Приветствую всех!

На странице есть таблица:

<table style="WIDTH:100%" cellspacing="1" cellpadding="0" border="0">
	<tbody>
		<tr>
			<td></td>
			<td style="VERTICAL-ALIGN:middle;WIDTH:33%;BACKGROUND-COLOR:#999999">&nbsp; <font color="#ffffff">МАРКА МАГНИТОЛЫ</font></td>
			<td style="VERTICAL-ALIGN:middle;WIDTH:33%;BACKGROUND-COLOR:#999999">&nbsp; <font color="#ffffff">ПРОИЗВОДИТЕЛЬ</font></td>
			<td style="VERTICAL-ALIGN:middle;WIDTH:33%;BACKGROUND-COLOR:#999999"><font color="#ffffff">ТИП ПАМЯТИ</font></td>
			<td style="VERTICAL-ALIGN:middle;WIDTH:33%;BACKGROUND-COLOR:#999999"><font color="#ffffff">ЦЕНА</font></td>
		</tr>
		<tr>
			<td></td>
			<td>&nbsp;</td>
			<td>&nbsp;</td>
			<td><p></p></td>
			<td>150&nbsp;руб.</td>
		</tr>
		<tr>
			<td></td>
			<td>&nbsp;</td>
			<td>&nbsp;</td>
			<td></td>
			<td>150&nbsp;руб.</td>
		</tr>
	</tbody>
</table>

Нужно её почистить и обернуть в <div class="table-responsive">...</div>

Как работать внутри тегов я знаю.
Написал код:

<script type="text/javascript">
	$(document).ready(function(){
	   $("table").addClass("table table-striped");
	   $("table").removeAttr("cellspacing").removeAttr("cellpadding").removeAttr("style").removeAttr("border");
	   $("tr").removeAttr("style");
	   $("td").removeAttr("style");
	   $("font").attr("color", "#c00");
	});
</script>

Работает, лишнее почистилось.
А вот как работать за пределами тегов я не знаю.
Нужно перед тегом <table поставить <div class="table-responsive"> и после тега </table> поставить </div>

Можете помочь?

Заранее, спасибо!