Problem when creating dataTable

I am working with a tabs component within a tab I am trying to place a dataTable but it marks me an error and I do not know what the problem is. Here I leave code that I am using.

Script Code

<script>
var id_maestro = <?php echo $maestro->id_usuario; ?>;
var tabla_grupos;

$(document).ready(function(){   
    declararDataTable();
});

function declararDataTable()
{
    var id_ciclo = $("#id_cicloVal").val(); 

    tabla_grupos = $('#grupos').dataTable({
        "oLanguage": {
                "sLengthMenu": "Mostrar _MENU_ grupos por página",
                "sZeroRecords": "No existen grupos",
                "sInfo": "Mostrando _START_ a _END_ de _TOTAL_ grupos",
                "sInfoEmpty": "Mostrando 0 a 0 de 0 grupos",
                "sInfoFiltered": "(Encontrados de _MAX_ grupos)"
        },
        "aoColumns": [{"sWidth":"10%"},{"sWidth":"15%"},{"sWidth":"20%"},{"sWidth":"20%"}],
        "bProcessing": true,
        "sAjaxSource": '../includes/acciones/get_grupos_json.php',
        "fnServerParams": function ( aoData ) {
            aoData.push({ "name": "id_maestro", "value": id_maestro });
            aoData.push({ "name": "id_ciclo", "value": id_ciclo });
        },
        "iDisplayLength": 25
    });
}
</script>

This is the html code

<div class="nav-tabs-custom">
  <ul class="nav nav-tabs">
    <li class="active"><a href="#grupos" data-toggle="tab">Grupos</a></li>
    <li><a href="#timeline" data-toggle="tab">Timeline</a></li>
    <li><a href="#settings" data-toggle="tab">Settings</a></li>
  </ul>
  <div class="tab-content">
    <div class="active tab-pane" id="grupos">
      <form class="form-inline">
       <div class="form-group">
        <label style="margin-right: 4px;">Ciclo Escolar</label>
        <select class="form-control" id="id_cicloVal" onChange="obtenerGrupos();">
        <?php
          $ciclos = Ciclo::getLista();

          if(is_array($ciclos))
          {
            foreach($ciclos as $ciclo)
            {
        ?>
             <option value="<?php echo $ciclo["id_ciclo_escolar"]; ?>">
               <?php echo $ciclo["nombre"]; ?>
             </option>
        <?php
            }
          }
        ?>
        </select>
       </div>
      </form>
      <table id="grupos" class="table table-bordered table-striped">
       <thead>
        <tr>
         <th>Clave</th>
         <th>Grado</th>
         <th>Materia</th>
         <th>Carrera</th>
        </tr>
       </thead>
       <tbody>
       </tbody>
      </table>
     </div>
     <!-- /.tab-pane -->
     <div class="tab-pane" id="datos">
     </div>
     <!-- /.tab-pane -->
   </div>
   <!-- /.tab-content -->
 </div>
 <!-- /.nav-tabs-custom -->

This is the error