kendo ui grid

hi, - I have kendo grid separately in a fiddle, - I have delete function seprately in a fiddle - when I select ThreeDots in each row in the grid it should show delete in small popup and when you click delete confirmation popup should open up. - after I click yes it should delete that particular row and when I slect no it should not delete. trying to display my confirmation box for delete in jquery way..providing that code below - can you guys tell me how to combine my code. - need to write jasmine test cases too and need help in integrate in my codebase - providing code and fiddle below [login to view URL] [login to view URL] <div class="sports"> <div class="kendopobUpBox kendoWindow kPopupConfirmationBox"> <div class="row kendoPopUpGridCollection kendoPopUpContent lineHeightInputs"> <div class="kendoContent">Are you sure you want to upload file</div> </div><div class="clearFloat"></div> <div class="row kendoPopUpFooter textAligncenterImp"> <button class="commonBtn" type="button" id ="playerDocumentOk" (click)="uploadFile($event,[login to view URL])">OK</button> <button class="clearBtn" type="button" id ="playerDocumentCancel" (click)="cancel()">Cancel</button> </div><div class="clearFloat"></div> </div> </div> $('.sports').show(); $('.sports').hide(); #runningDocumentsPopup .sports { position: relative; } .sports .kPopupConfirmationBox { display: block; z-index: 3; left: calc(50% - 175px); width: 350px; position: absolute; } .sports { display: none; }