JavaScript QuerySelector failed

Question

anyone have a idea why the querySelector wont work ?

var itemID ="8zoncALaudovCbLRYGbx";

console.log(document.getElementById(itemID)); //work
console.log(document.querySelector("."+itemID)); //not work why ? (error :"not a valid selector")
console.log(document.querySelector("#"+itemID)); // not work why ? (error :"not a valid selector")

<div class="8zoncALaudovCbLRYGbx" id="8zoncALaudovCbLRYGbx">useless text</div>

Answer 1

use this function

   function EditModal(itemID) {
  const mod = document.querySelector(".edit-modal");
  document.body.style = "overflow:hidden; position :absolute;height:100%";

  const test = document.getElementById(itemID);
  console.log(document.querySelector('div[id="'+`${itemID}`+'"]'));

  mod.innerHTML = `"$⏪for testing"{document.querySelector("div."+itemID+",.title")}`;
}