0

I have an accordian and I am trying to add a title attribute to the link for people with screen reader. I am using jQuery Mobile and not sure if it is interfering with the . The issue is that it doesn't work. Here is the script:

$(function () {
    $("#accordionContent h3 a").each(function () {
        if ($(this).prop("class") == "accordionLink on") {
            $(this).prop("title", $(this).text() + ", Submenu Open");
            $(this).next().show();
        } else {
            $(this).prop("title", $(this).text() + ", Submenu Closed");
            $(this).next().hide();
        }
    });
});

Here is the HTML:

<div data-role="content">
    <div id="accordianContent" data-role="collapsible-set">
        <div data-role="collapsible">
            <h3><a href="#" title="" style="text-decoration:none;">JSON Tutorial</a></h3>
            <p>Getting started with JSON</p>
        </div>
        <div data-role="collapsible">
            <h3><a href="#" title="" style="text-decoration:none;">WordPress Newbie Tips</a></h3>
            <p>Tips for the beginning WordPress user</p>
        </div>
        <div data-role="collapsible">
            <h3><a href="#" title="" style="text-decoration:none;">Domain name tips</a></h3>
            <p>Tips for getting a good domain name</p>
        </div>
        <div data-role="collapsible">
            <h3><a href="#" title="" style="text-decoration:none;">Subdomain Advantages</a></h3>
            <p>How and why to using a subdomain</p>
        </div>
    </div>
</div>
Alex Pan
  • 4,341
  • 8
  • 34
  • 45
Grady McGhee
  • 311
  • 5
  • 20

1 Answers1

1

Can you try .attr instead of .prop?

There are cases when one of them is preferred over the other one, you can read more here: .prop() vs .attr()

Community
  • 1
  • 1
renakre
  • 8,001
  • 5
  • 46
  • 99