Disable selected rows in some rows of dataTable

Question

I use DataTable for create a list. and I unable selected multirow in it. when click on some first rows (page1 of table), rows was selected. but when click on other pages, rows was not selected and was not go to this script and dont show anything:

 $("#example tbody tr").click( function( e ) {

                            console.log(e);
                            console.log( $(this).hasClass('selected'));

                            if ( $(this).hasClass('selected') ) {
                                console.log(1111111111);
                                $(this).removeClass('selected');
                            }
                            else {
                                console.log(222222222);
                                table.$('tr.selected')//.removeClass('selected');
                                $(this).addClass('selected');
                            }
                        }); 

my table:

 Studentjson = {BrowserStats};

                        var data = jQuery.map(Studentjson.BrowserStats, function (el, i) {
                            return [[el.imagePath, el.firstName, el.lastName, el.homeLocationText, el.homePhoneNumber,
                                el.role, el.edit, el.delete]];
                        });

                              table = $('#example').DataTable({
                            "aaData": data,
                            columns: [
                                {
                                    "width": "3%",
                                    data: null,
                                    className: "center",
                                    "orderable": false,
                                    defaultContent: '<img class="img-responsive"  src="" />'
                                },
                                {"width": "27%"},
                                {"width": "27%"},
                                {"width": "37%"},
                                {
                                    data: null,
                                    "width": "3%",
                                    className: "center",
                                    "orderable": false,
                                    defaultContent: '<p data-placement="top" data-toggle="tooltip" title="Edit"><button id="EditStudent" class="btn btn-primary btn-xs" data-title="ویرایش"  ><span class="glyphicon glyphicon-pencil"></span></button></p></td>'
                                },
                                {
                                    data: null,
                                    "width": "3%",
                                    "orderable": false,
                                    defaultContent: '<p  data-placement="top" data-toggle="tooltip" title="Delete"><button id="DeleteStudent" class="btn btn-danger btn-xs" data-title="Delete"  ><span class="glyphicon glyphicon-trash"></span></button></p>'
                                },
                                {

                                    "visible": false,
                                    "searchable": false
                                },
                                {

                                    "visible": false,
                                    "searchable": false
                                }
                            ]
                        });

Why this is? What i must do?