Failed to execute query selector on document, id is not a valid selector
You can use template string literals for this because id must be in quotes otherwise it won't work and be sure to use HTML5 at the top of your document. With this I didn't have any more issues.
For example:
document.querySelector(`[data-id="${id}" ]`);
Or if for any reason you don't want to use template literals add this line of code:
document.querySelector("[data-id=" + "\'" + id + "\'" + "]");
With escape character \' in double quotes.
Hope this helps.
If using HTML4 ids must start with a letter (https://www.w3.org/TR/html4/types.html#type-id)
If using HTML5 you can use numbers.
Either change your ids to start with a letter (as in id="p12345") or use HTML5
(i.e. use <!DOCTYPE html> at the top of your document)