jquery - Remove row between table header and row -

see fiddle

this jquery :

function searchrecords() {         $('#searchme').tableutils({             filter: {                 type: ['nofilter', 'nofilter', 'text']             },             fixheader: {                 width: 1000,                 height: 200             },          columns: [{             label: 'first name'         }, {             label: 'last name'         }, {             label: 'concept'         }, {             label: 'rating'         }, {             label: 'aka'         }]     });      $('#searchrecords').hide(); }  searchrecords();  $('#filter_searchme_2').css('width', '100px').detach().appendto("#outside"); 

how can remove row between table header , first table row? basically,the area filtering every column not want filter every column remove 1 textbox filtering , put outside table. appreciated.thanks in advance.

you can see mean on original code filtering on link,click transform on search through table category.

the space below table header not row. it's gap created due maintablewrapper_searchme's css attribute top: 54px;.
can override using below css:

#maintablewrapper_searchme {     top: 0 !important; } 

the !important keyword overrides other rules specified css property.
fiddle: http://jsfiddle.net/y9hm6xhc/

edit
can use jquery:

$(function(){     $('#maintablewrapper_searchme').css('top', '0'); })