I get this error.I want to add multiple selector and it gives error.what is the problem?
jQuery(document).ready(function($) {
$("nav.navbar.bootsnav.menu-style1 ul.dropdown-menu.megamenu-content .title,
.pagination>li>a,
.ulockd-title-icon,
.fancybox-gallery-slider .owl-prev,
.fancybox-gallery-slider .owl-next,
.team-icon a,
.twitter.style2 ul li a,
.text-thm, .text-thm2").css("color", textColor);;
return false;
});
CodePudding user response:
You can adress this error a couple of ways:
Use \
before each newline
$("nav.navbar.bootsnav.menu-style1 ul.dropdown-menu.megamenu-content .title, \
.pagination>li>a, \
.ulockd-title-icon, \
.fancybox-gallery-slider .owl-prev, \
.fancybox-gallery-slider .owl-next, \
.team-icon a, \
.twitter.style2 ul li a, \
.text-thm, .text-thm2").css("color", textColor);
Use string concatination
$("nav.navbar.bootsnav.menu-style1 ul.dropdown-menu.megamenu-content .title,"
".pagination>li>a,"
".ulockd-title-icon,"
".fancybox-gallery-slider .owl-prev,"
".fancybox-gallery-slider .owl-next,"
".team-icon a,"
".twitter.style2 ul li a,"
".text-thm,"
".text-thm2").css("color", textColor);
Build selectors from array
let selectors = [
"nav.navbar.bootsnav.menu-style1 ul.dropdown-menu.megamenu-content .title",
".pagination>li>a",
".ulockd-title-icon",
".fancybox-gallery-slider .owl-prev",
".fancybox-gallery-slider .owl-next",
".team-icon a",
".twitter.style2 ul li a",
".text-thm",
".text-thm2"
];
$(selectors.join(',')).css("color", textColor);
Using a template literal
$(`nav.navbar.bootsnav.menu-style1 ul.dropdown-menu.megamenu-content .title,
.pagination>li>a,
.ulockd-title-icon,
.fancybox-gallery-slider .owl-prev,
.fancybox-gallery-slider .owl-next,
.team-icon a,
.twitter.style2 ul li a,
.text-thm, .text-thm2`).css("color", textColor);
or give them a common class
As you can see having a lot of selectors like this is not easy to use. Not even speaking of managing changes over time.
Why not give them a common class like changeable-color
and only select that one. Easier to read and maintain.