Javascript 元件仅在使用检查元件后加载

我使用下面的代码在单击链接时隐藏/显示div。代码似乎在工作，因为它显示一个div并隐藏其他div，但是div中的元素只有在我单击Inspect Element之后才会显示，这是一个非常奇怪的bug，有什么建议吗

HTML

<a href="javascript:void(0)" class="showinstagram" name="electronics"> Show Me </a>
<a href="javascript:void(0)" class="showinstagram" name="antiques"> Show Me </a>
<a href="javascript:void(0)" class="showinstagram" name="jewelry"> Show Me </a>
<a href="javascript:void(0)" class="showinstagram" name="random"> Show Me </a>

<div style="display:none" class="instagram" id="electronics">
[instashow source="@username" gutter="4" drag_control="false" free_mode="true" scrollbar="false" speed="0" easing="linear" auto_hover_pause="false" popup_deep_linking="true" popup_info="username instagramLink likesCounter commentsCounter description" analytics="false"]
</div>
<div style="display:none" class="instagram" id="antiques">
[instashow source="@username" gutter="4" drag_control="false" free_mode="true" scrollbar="false" speed="0" easing="linear" auto_hover_pause="false" popup_deep_linking="true" popup_info="username instagramLink likesCounter commentsCounter description" analytics="false"]
</div>
<div style="display:none" class="instagram" id="jewelry">
[instashow source="@username" gutter="4" drag_control="false" free_mode="true" scrollbar="false" speed="0" easing="linear" auto_hover_pause="false" popup_deep_linking="true" popup_info="username instagramLink likesCounter commentsCounter description" analytics="false"]
</div>
<div style="display:none" class="instagram" id="random">
[instashow source="@username" gutter="4" drag_control="false" free_mode="true" scrollbar="false" speed="0" easing="linear" auto_hover_pause="false" popup_deep_linking="true" popup_info="username instagramLink likesCounter commentsCounter description" analytics="false"]
</div>

[instashow source=“@username”gotter=“4”drag\u control=“false”free\u mode=“true”scrollbar=“false”speed=“0”easing=“linear”auto\u hover\u pause=“false”popup\u deep\u linking=“true”popup\u info=“username instagramLink likesconter comments description”analytics=“false”]
[instashow source=“@username”gotter=“4”drag\u control=“false”free\u mode=“true”scrollbar=“false”speed=“0”easing=“linear”auto\u hover\u pause=“false”popup\u deep\u linking=“true”popup\u info=“username instagramLink likesconter comments description”analytics=“false”]
[instashow source=“@username”gotter=“4”drag\u control=“false”free\u mode=“true”scrollbar=“false”speed=“0”easing=“linear”auto\u hover\u pause=“false”popup\u deep\u linking=“true”popup\u info=“username instagramLink likesconter comments description”analytics=“false”]
[instashow source=“@username”gotter=“4”drag\u control=“false”free\u mode=“true”scrollbar=“false”speed=“0”easing=“linear”auto\u hover\u pause=“false”popup\u deep\u linking=“true”popup\u info=“username instagramLink likesconter comments description”analytics=“false”]

Javascript

<script>
    jQuery(document).ready(function($){
        $('a').click(function () {
            var divname= this.name;
            $("#"+divname).show().siblings().hide();
        });
    });
</script>

jQuery（文档）.ready（函数（$）{
$（'a'）。单击（函数（）{
var divname=this.name；
$（“#”+divname）.show（）.sides（）.hide（）；
});
});

---

编辑*：我还注意到，如果我调整屏幕大小，div中的内容也会加载。

代码看起来不错，但是使用class

instagram

的div的实际内容是什么？他们是否有iframe或一些嵌入式内容？这是一个从Instgram加载照片的快捷码。您可以将代码粘贴到带有class

instagram

的divs中吗？只是想弄清楚你是如何显示instagram中的内容的……你在使用wordpress插件吗？Cleary不应该工作。[instagram不是HTML标签，浏览器会像文本一样显示它。要完成这项工作，你需要使用js插件。你有没有用于此目的的插件？代码看起来不错，但instagram类的div的实际内容是什么？它们有iframe还是一些嵌入内容？这是一个从Instgram加载照片的短代码，你可以粘贴吗这里是DIV中的代码，类为

instagram

？只是想弄清楚你是如何显示instagram中的内容的…你使用的是wordpress插件吗？Cleary不应该工作。[instagram不是HTML标签，浏览器会像文本一样显示它。要做这项工作，你需要使用js插件。你有没有用于此目的的插件？