将.active类添加到div

Question

I'm trying to just add an .active class to a sidebar div when it is on that page. You can see the example here: http://nsiprojects.voodoodev3.co.uk/?page_id=193 which is literally only highlighting the first div as opposed to the active div.

<div class="mezzanine-sub">
                <?php
$childpages = query_posts('orderby=menu_order&order=asc&post_type=page&post_parent=35');
if($childpages) { /* display the children content  */
foreach ($childpages as $post) :
setup_postdata($post) ?>
        <script type="text/javascript">
            $(function() {
                var current = location.pathname;
                $('.mezzanine-sub a').each(function() {
                    var $this = $(this);
                    // if the current path is like this link, make it active
                    if ($this.attr('href').indexOf(current) !== -1) {
                        $this.addClass('active');
                    }
                })
            })
</script>

     <a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>" class="mezzanine-sub-title">
        <span><?php the_title(); ?></span>
    <a>

     <!-- post thumbnail -->
    <?php
        global $post; ?>
    <?php
    $src = wp_get_attachment_image_src(get_post_thumbnail_id($post -> ID), array(5600, 1000), false, '');
    ?>
    <div class="mezzanine-sub-image" style="background: url(<?php echo $src[0]; ?> );border:<?php the_field('border'); ?>;"></div>
    <!-- /post thumbnail -->

    <!-- post title -->
                <?php
                endforeach;
                } ?>
                </div>

Answer 1

No need to use any jQuery/JavaScript code. You can apply active class by comparing the page_id that exists as query string.

<div class="mezzanine-sub">
    <?php
    $childpages = query_posts('orderby=menu_order&order=asc&post_type=page&post_parent=35');
    if ($childpages)
    {
        // Display the children content
        foreach ($childpages as $post)
        {
            setup_postdata($post)
            ?>
            <a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>" class="mezzanine-sub-title <?php echo!empty($_GET['page_id']) && $_GET['page_id'] == $post->ID ? "active" : NULL ?>">
                <span><?php the_title(); ?></span>
                <a>
                    <?php
                    global $post;
                    $src = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), array(5600, 1000), false, '');
                    ?>
                    <div class="mezzanine-sub-image" style="background: url(<?php echo $src[0]; ?> );border:<?php the_field('border'); ?>;">
                    </div>
                </a>
            </a>
            <?php
        }
    }
    ?>
</div>