The dark-light toggler icon is not changing from moon to sun while toggling even after giving the Javascript logic to the code. The code is attached as under:-

const themeToggleIcon = document.getElementById("theme-toggle-icon");
const themeToggleLogo = document.getElementById("theme-toggle-logo");
themeToggleIcon.addEventListener("click", function (e) {
  document.body.classList.toggle("dark-theme");
  document.body.classList.toggle(":root")
  e.preventDefault();
  if (document.body.classList.contains("dark-theme")) {
    themeToggleIcon.src = "../Images/navbar/sun.png";
    themeToggleLogo.src = "Images/logo/Logo-Dark.png";
  } else {
    themeToggleIcon.src = "../Images/navbar/moon.png";
    themeToggleLogo.src="Images/logo/Logo-Light.png";
  }
});

I was trying to create a navbar which gets toggled between black and white using the dark-light toggler button alongwith the toggler button gets toggled between sun and moon icon but it is constantly showing moon icon.