Conflict with Datatables & Highcharts!

Hey all so, as the tittle says I am using datatables with high charts, before I enter the javascript into the header datatables works perfect, after I enter the script the table doesnt sort or paginate! here is the code

Thanks for any help!! vvvvvv

<script type="text/javascript" charset="utf-8">
$(document).ready(function () {
$('.dataTable').dataTable({
"aaSorting":[
[ 1, "desc" ]
],
"iDisplayLength":20,
"bFilter":false
});
});
</script>
<script type="text/javascript" charset="utf-8">

$(function () {
var chart;
$(documentt).ready(function () {
chart = new Highcharts.Chart({
chart:{
renderTo:'container',
backgroundColor:'#000000',
plotBorderWidth:null,
plotShadow:true
},
title:{
style:{
color:'#ffffff',
fontWeight:'normal'
},
text:'Facility Captures'
},
tooltip:{

enabled:true

},
plotOptions:{
pie:{
allowPointSelect:true,
cursor:'pointer',
borderColor:'#ffffff',

dataLabels:{
enabled:true,
color:'#ffffff',
connectorColor:'#ffffff',
formatter:function () {
return '<b>' + this.point.name + '</b> ';
}
}
}
},
series:[
{
type:'pie',
name:'captures',
data:[
<?php facility_capture_count(); ?>
]
}
]
});
});

});
</script>