Jquery - применить класс на основе содержимого <a>

Question

У меня есть горизонтальное меню навигации, из которого я могу редактировать источник, мой единственный вариант - динамически добавлять классы, когда он загружается через JQUERY.

Представьте, у меня есть 3 вкладки:

Home, Profile, Blog

Каждый со ссылкой примерно так:

<a href="home.html">Home</a>

Возможно ли, чтобы JQUERY посмотрел между тегами <a> </a> и нашел текст (например, Home) и использовал этот текст в качестве класса?

Так что мой <a href="home.html"> становится: <a class="Home" href="home.html">

Answer 1

Вы можете использовать :contains, если знаете, что ищете:

$('a :contains(Home)').addClass('home');

Я думаю, это было бы более надежно:

$('a.nav').each(function() {

    // add class with name of the link's text
    $(this).addClass($(this).text());
});

Предполагается, что вы дадите своим навигационным ссылкам класс nav.

Answer 2

$("a").each(function () {
  var self = $(this);
  self.addClass(self.text());
});

Answer 3

Вы хотите что-то вроде этого:

$("a:contains('Home')").removeClass().addClass("Home");