需要帮助以编程方式显示数组内容

Question

我有一个关联数组，其中包含用于代码的

部分的jQuery导航列表标题的密钥对。见下图左侧：

问题出在右侧。右边的列表会自动填充，当它应该是选项卡的内容时，阿巴拉契亚＆amp; amp;农村研究＆＃34;。当我加载页面时，会生成此页面，但是当我单击任何单个链接时，代码可以正常工作，并且只显示与正确选项卡关联的内容区域标题，请参阅下文：

以下是完成所有这些操作的代码：

<!-- Tabbed research areas content -->
<h4>Research Areas</h4>
<hr></hr>
<script type="text/javascript">
/* <![CDATA[ */
$(document).ready(function(){
$("#tabs li").click(function() {
    //  First remove class "active" from currently active tab
    $("#tabs li").removeClass('active');

    //  Now add class "active" to the selected/clicked tab
    $(this).addClass("active");

    //  Hide all tab content
    $(".tab_content").hide();

    //  Here we get the href value of the selected tab
    var selected_tab = $(this).find("a").attr("href");

    //  Show the selected tab content
    $(selected_tab).fadeIn();

    //  At the end, we add return false so that the click on the link is not executed
    return false;
});
});
/* ]]> */
</script>
<div id="tabs_wrapper">
            <div id="tabs_container">
            <?php 
                $Researchareas = array(
                     '1' => 'Appalachian & Rural Studies',
                     '2' => 'Child Welfare',
                     '3' => 'Gerontology',
                     '4' => 'Human Trafficking',
                     '5' => 'International Social Work',
                     '5' => 'Intimate Partner Violence',
                     '7' => 'LGBTQ',
                     '8' => 'Substance Abuse and Misuse',
                     '9' => 'Suicide Survivors and Bereavement',
                     '10' => 'Trauma and Post-Traumatic Stress',
                     '11' => 'Veterans and Military Social Work'
                );
                ?>
                <ul id="tabs">
                <?php 
                    foreach ($Researchareas as $key => $value){
                        $tabname = 'tab'.$key; 
                ?>
                    <li><a href="#<?php echo $tabname ?>"><?php echo $value ?></a></li> 
                <?php } ?>
                </ul>
            </div>
            <div id="tabs_content_container">
                <?php
                foreach ($Researchareas as $key => $value) {
                    $divtab = 'tab'.$key;
            ?>
        <div id="<?php _e($divtab); ?>" class="tab_content" style="display: block;">
        <h4><?php _e($value); ?></h4>
            </div>  
        <?php } ?>
    </div>
</div>

<!--end tabbed research content area-->

我基本上只需要在页面加载时不要在完整列表中加载所有数组值，而是只需准确显示第一个选项卡，就像在第二个图像中一样。我不知道我错过了什么，但我绝对是。非常感谢任何帮助，我将永远感激。