Получить атрибут класса для выбранного элемента

Question

В следующем HTML, когда я нажимаю на любой элемент списка, я хочу добавить к нему класс .active. После этого, когда я нажимаю на ссылку, я хочу получить класс li (исключая .active).

Например, щелкнув по первому элементу li, он должен добавить к нему класс .active, и, щелкнув по ссылке, он должен получить класс one.

Я могу добавить к нему класс, но не могу получить добавленное значение класса, нажав на ссылку.

HTML:

<ul> 
    <li class="one">One</li> 
    <li class="two">Two</li> 
    <li class="three">Three</li>  
</ul> 

<a href="#" class="select">Check Selected </a> 

JQuery:

$(document).on('click','ul li',function(e){ 
     $('ul li').removeClass('active'); 
     $(this).addClass("active"); 
    }); 

$(document).on('click','.select',function(e){ 
     var abc = $('ul li.active').attr('class'); 
     alert('Selected li class is ' + abc);  
    }); 

Демо: http://jsfiddle.net/n9awc/

Спасибо за любую помощь.

Answer 1

Вы можете сделать это:

$(document).on('click', '.select', function (e) { 
    var abc = $('ul li.active').attr('class').replace('active', ''); 
    alert('Selected li class is ' + abc); 
}); 

Демо: Fiddle

---

$('ul li.active').attr('class') возвращает строку, имеющую все классы, как one active или two active. Теперь мы можем просто удалить эту строку active, используя String.replace

Answer 2

Использование .split()

alert($('ul li.active').attr('class').split(' ')[0]); 

Demo

Здесь я разделив строку с пространством, и чем Возвращает 1-значение индекса с помощью [0].

Answer 3

Попробуйте один

<ul> 
     <li class="one">One</li> 
     <li class="two">Two</li> 
     <li class="three">Three</li>  
    </ul> 

    <a href="#" class="select">Check Selected </a> 

    $('ul').on('click','li',function(){ 
// in case of if some li element has the active class, left quit 
$('li .active').removeClass('active') 
     $(this).addClass("active'); 
    }) 


    $('.select').click(function(){ 
    alert("You've click" + $('.active').text()) 
    }) 

Answer 4

Почему вы не сохранить класс переменной?

$(document).on('click','ul li',function(e){ 
    var thisClass = $(this).attr('class'); 

    $('ul li').removeClass('active'); 
    $(this).addClass("active"); 
});