データテーブルの行の詳細でボタンを非表示/表示

問題は、（今のところ）40行のカスタムデータテーブルがあり、各行に詳細があり、最近、各行の詳細コンテンツに「編集オプション」を追加したことです。コードはこれに基づいています：https：//datatables.net/release-datatables/examples/api/row_details.htmlしかし、私はFormatDetailsをこれに変更しました：

function fnFormatDetails ( oTable, nTr )
    {   
        var aData = oTable.fnGetData( nTr );
        var sOut = '<input type=\'button\' id=\'hideshow\' value=\'hide/show\'><table id="tablaeditar" class="tablaeditar">';
        sOut += '<tr><td><input id="nombref" placeholder="Nombre de Fantasia" type="textbox" value="'+aData[1]+'" maxlength="40" onkeypress="return permite(event, \'car\')" /></td>' + 
                '<td><input id="titular" placeholder="Titular" type="textbox" value="'+aData[2]+'" maxlength="40" onkeypress="return permite(event, \'car\');" /></td>' +
                '<td><input id="direccion" placeholder="Direccion" type="textbox" value="'+aData[3]+'" maxlength="50" onkeypress="return permite(event, \'num_car\')"/></td></tr>' +
                '<tr><td><input id="telefono" placeholder="Telefono" type="textbox" value="'+aData[4]+'" maxlength="30" onkeypress="return permite(event, \'num\');" /></td>' +
                '<td><input id="email" placeholder="Email" type="textbox" value="'+aData[5]+'" maxlength="40" /></td>' +
                '<td><input id="paginaweb" type="textbox" placeholder="Pagina Web" value="'+aData[6]+'" maxlength="40" /></td></tr>' +
                '<tr><td><input id="comentarios" type="textbox" placeholder="Comentarios" value="'+aData[7]+'"  maxlength="40"></td>' +
                '<td><input id="metros" type="textbox" placeholder="Superficie" value="'+aData[8]+'" maxlength="5" onkeypress="return permite(event, \'num\');" /></td>' +
                '<td align="center"><div class="aceptar"><input type="button" value="Aceptar"></input></div></td></tr>'
        sOut += '</table>';

        return sOut;
    }

ご覧のとおり、行全体の情報を入力に入れ、各行の詳細を表示するのは長いコードなので、クラス「edittable」でsOutテーブルを表示および非表示にできるボタンを配置します。このような単純なもの：http：//jsfiddle.net/vVsAn/1/

私は次のコードでこれをやろうとしました：

$(document).ready(function() {  
    $('#hideshow').on('click', function(){
    $(this).closest('table.tablaeditar').toggle();
    });
});

しかし、それは機能しません

どうすればいいですか？

前もって感謝します！