Get aria-expanded value

Issue

I didn't find a way to get aria-expanded value from DOM.

<a class="accordion-toggle collapsed" href="#collapse-One" data-parent="#accordion-1" data-toggle="collapse" aria-expanded="false">
    <i class="fa fa-search-plus"></i>
    test
</a>

I want to test if it's true then I can change <i> class to fa-search-minus. I tried this but I always get an undefined value:

console.log($(this).find('a.aria-expanded').val());

Solution

aria-expanded is an attribute on the element, not a class, so the selector is incorrect. Secondly, you should use the attr() function to get the value of that attribute. val() is intended to retrieve the value attribute from form related elements, such as input and textarea. Try this:

console.log($(this).find('a[aria-expanded]').attr('aria-expanded'));

Answered By - Rory McCrossan