The whole day I am trying to get this done loop, however i can't decipher it.

I acquired a wordpress wordpress plugin named e-commerce. On one product page I have to produce a simple javascript switch display:none - display:block.


I'm by using this javascript:

<script language="JavaScript">
//here you place the ids of every element you want.
var ids=new Array('a1','a2','a3','thiscanbeanything');

function switchid(id){  
    hideallids();
    showdiv(id);
}

function hideallids(){
    //loop through the array and hide each element by id
    for (var i=0;i<ids.length;i++){
        hidediv(ids[i]);
    }         
}

function hidediv(id) {
    //safe function to hide an element with a specified id
    if (document.getElementById) { // DOM3 = IE5, NS6
        document.getElementById(id).style.display = 'none';
    }
    else {
        if (document.layers) { // Netscape 4
            document.id.display = 'none';
        }
        else { // IE 4
            document.all.id.style.display = 'none';
        }
    }
}

function showdiv(id) {
    //safe function to show an element with a specified id

    if (document.getElementById) { // DOM3 = IE5, NS6
        document.getElementById(id).style.display = 'block';
    }
    else {
        if (document.layers) { // Netscape 4
            document.id.display = 'block';
        }
        else { // IE 4
            document.all.id.style.display = 'block';
        }
    }
}
</script>

Which HTML:

<p>Try these: <a href="javascript:switchid('a1');">show a1</a>
<a href="javascript:switchid('a2');">show a2</a>
<a href="javascript:switchid('a3');">show a3</a>
<a href="javascript:switchid('thiscanbeanything');">show 'thiscanbeanything'</a></p>

<hr/>

    <div id='a1' style="display:block;">
        <h2>Sample text:</h2>
        <p><b>Jean-Paul Sartre, (1905-1980)</b> born in Paris in 1905...</p>
    </div>

    <div id='a2' style="display:none;">
        <h3>More on JPS</h3>
        <p>The conclusions a writer must draw from this position...</p>

    </div>

    <div id='a3' style="display:none;">


        <p>Yet more content. This can be anything in here, html,
        pictures.. flash ...</p>
    </div>

    <div id='thiscanbeanything' style="display:none;">
        <h3>This content is in a div with id "thicanbeanything"</h3>    
            <p>Sartre is one of those writers for whom a determined...</p>
    </div>

I have to put this HTML and Javascript within this bit of code. It's from core E-commerce's apply for single product display:

<?php /** the custom meta HTML and loop */ ?>
                            <div class="custom_meta">
                                <?php while (wpsc_have_custom_meta()) : wpsc_the_custom_meta();     
                                        if (stripos(wpsc_custom_meta_name(),'g:') !== FALSE){
                                            continue;
                                        }
                                    ?>
                                    <strong><?php echo wpsc_custom_meta_name(); ?>: </strong><?php echo wpsc_custom_meta_value(); ?><br />
                                <?php endwhile; ?>
                            </div>
                        <?php /** the custom meta HTML and loop ends here */?>

Things are known as through a single variable: $wpsc_query;. Thare the values we are searching for:

[custom_meta_values] => Array ( [id] => 75 [product_id] => 6 [meta_key] => Product code [meta_value] => 123123123123 [custom] => 1 )

So essentially I have to produce a loop that can take every meta_key and meta_value held in plug ins product options at the spine-finish of wordpress. And make up a loop that will take these values, place them into <div>'s and set the javascript's <a> link inside.


P.S. I had been searching for something similar to:

<?php
                                    foreach ($wpsc_query->custom_meta_values['meta_key']) {

                                    print '<div class="single_menus_wrapper">';
                                    print '<a href="javascript:switchid("single_menu_' . custom_meta_$i . '");">show single_menus_title</a>';
                                    print '<div id="single_menu_' . custom_meta_$i . '"><div class="single_menus_holder">';
                                     print '<div class="single_menus_title">' . echo wpsc_custom_meta_name(). ':</div>';
                                    print '<div class="single_menus_description">' . echo wpsc_custom_meta_value() . '</div>';
                                    print '</div></a></div>';
                                   }
                                    ?>

However this content will not show on the page. Due to the fact this bit of code is absurd. Any help could be great, link's to lessons, a guidance, part of code, or at best a concept things i ought to be searching for here.