SharePoint JSOM problem in delete functionality

Hello All,

I'm trying to insert and delete with the same function ,which I called on img onclick.

It is working fine in Insert case but not running in delete case.

Need your assistance.

Here is the code snippet

function checkClick(elem)
{
var ctx = new SP.ClientContext.get_current();
var list = ctx.get_web().get_lists().getByTitle("UserAppStationTest");
ctx.load(list);
alert('hello list is loaded');
var listItemCreationInfo = new SP.ListItemCreationInformation();
var insertItem = list.addItem(listItemCreationInfo);

var i='/sites/OptiBoltUAT/_catalogs/masterpage/OptiBolt/images/wallpingray.png';
var ImageBtnID = elem.id;

alert(ImageBtnID);

var userName="[email protected]";
var msglist = document.getElementById(ImageBtnID);
var getattr=msglist.getAttribute("src");
if(i===getattr){

msglist.setAttribute("src",'/sites/OptiBoltUAT/_catalogs/masterpage/OptiBolt/images/wallpin.png');
var camlQuery = new SP.CamlQuery();

camlQuery.set_viewXml(''+ImageBtnID+'');

var collListItem = list.getItems(camlQuery);
collListItem.deleteObject();

list.update();

ctx.load(list);

ctx.executeQueryAsync(success, error);

function success() {
alert('success');
alert('Item Deleted Successfully')

}
function error(sender, args) {
alert('Failed to insert Error:' + args.get_message());

}

}

else
{
msglist.setAttribute("src",'/sites/OptiBoltUAT/_catalogs/masterpage/OptiBolt/images/wallpingray.png');

insertItem.set_item("ImageID", ImageBtnID);
insertItem.set_item("UserMailID", userName);
insertItem.update();
ctx.executeQueryAsync(success, error);

function success() {
alert('success');
alert('Item Inserted Successfully')

}
function error(sender, args) {
alert('Failed to insert Error:' + args.get_message());
}

}

Any help will be Appriciated!

Thanks!