On second thought, I don't think this will work because I have a data-driven site with a single index page, so I can't add the separate body classes to each page.

Actually it still works, but only on the parent item. I just modified the menu CSS so now this new rule is somehow affecting how the active list item is being displayed.

#navigation ul li.parent>a{

    background-image: url(../../images/style1/nav-has-parent_down_png32.png);

    background-repeat: no-repeat;

    background-position: 95% 75%;

Using Firebug I have found the problem, I think.

This is what the HTML looks like on a non-parent active page when the menu element is selected (no persistence):

<li style="position: relative; display: block; top: 0px; z-index: 1; float: left;" class="item59"><a style="display: block;" href="/index.php/about-us"><span>About Us</span></a></li>

This is what the HTML looks like on an active parent link when a child list item is selected (persistence enabled):

<li style="position: relative; display: block; top: 0px; z-index: 1; float: left;" class="parent active item39 submenu-down"><a style="display: block;" href="#"><span>Our Services</span></a><ul style="display: block; visibility: hidden; opacity: 0; position: absolute; top: 45px; left: 0px; margin-left: 0px;"><li style="visibility: hidden; opacity: 0; position: relative; display: block; top: 0px; z-index: 1;" id="current" class="active item67"><a style="display: block;" href="/index.php/our-services/services-overview"><span>Services Overview</span></a></li><li style="visibility: hidden; opacity: 0; position: relative; display: block; top: -40px; z-index: 1;" class="item50"><a style="display: block;" href="/index.php/our-services/content-management"><span>Content Management</span></a></li><li style="visibility: hidden; opacity: 0; position: relative; display: block; top: -78px; z-index: 1;" class="item51"><a style="display: block;" href="/index.php/our-services/e-commerce-sites"><span>E-Commerce Sites</span></a></li><li style="visibility: hidden; opacity: 0; position: relative; display: block; top: -116px; z-index: 1;" class="item52"><a style="display: block;" href="/index.php/our-services/community-websites"><span>Community Websites</span></a></li></ul></li>

And this is what the HTML looks like on a no-parent active page on the original unmodified CMS template:

<li id="current" class="active item33"><a href="/jaunty/index.php?option=com_content&amp;view=article&amp;id=13 &amp;Itemid=33"><span><span class="title">Typography</span><span class="subtitle">beautiful typeface</span></span></a></li>

Somehow I have lost my styling elements for non-parent menu list items that make the active state persist. I must have deleted a CSS rule.