Question

I have an array of Vimeo iframes on my site which, on refresh, gets called randomly from the array. Each of these iframes have unique IDs.

What I’m after is depending on which iframe is displayed, it’ll recognise the ID and add a class to the menu item.

So far I have this:

$("#yuan-photofilm").find(".menu-nav li ul li a").addClass('active-vimeo');

My thinking is that if #yuan-photofilm exists, it’ll find .menu-nav li ul li a and add the class .active-vimeo – but it doesn’t seem to work.

Any ideas?

Thanks,
R

Here’s some of the HTML

<div class="grid_7 suffix_5">
        <div class="video-container">
            <iframe id="jack-photofilm" src="http://player.vimeo.com/video/46822673?title=0&amp;portrait=0&amp;byline=0&amp;color=ffffff" width="650" height="366" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>   </div>
</div>
<div class="clear"></div>
    <div class="grid_7">
        <ul class="menu-nav">
            <li class="current-menu-nav-item"><a href="index.php">Photofilms</a>
                <ul>
                    <li><a href="#yuan" id="yuan">Yuan Shuai</a></li>
                    <li><a href="#nina" id="nina">Nina</a></li>
                    <li><a href="#zhuoer" id="zhuoer">Zhuoer</a></li>
                    <li><a href="#qingqing" id="qingqing">Uncle Douglas and Qingqing</a></li>
                    <li><a href="#jack" id="jack">Jack</a></li>
                </ul>   
            </li>
            <li><a href="still.php">Photographs</a></li>
            <li class="sub-info-menu"><a href="information.php">Information</a></li>
            <li><a href="http://blog.youziproject.com">Blog</a></li>
        </ul>
    </div>

Answer 1

Each element seems to have an ID, why not just target that ?

if ($("#yuan-photofilm").length) {
   $("#yuan").addClass('active-vimeo');
}

or more dynamic:

$('.menu-nav li ul li a').each(function(i,e) {
    if ($('#'+e.id+'-photofilm').length) $(e).addClass('active-vimeo');
});