隐藏和显示列表元素HTML和Jquery

Question

我正在创建一个页面，该页面仅在用户登录时显示在标题选项卡中。但是，如果用户未登录，则应将其隐藏。如何隐藏元素？

这是我的HTML：

<li ng-if="isAuthenticated" ><a active-link="active" href="#/dashboard"><span translate>Dashboard</span></a></li>
<li id="about"><a active-link="active" href="#/about"><span translate>About</a></li>
<li id="info"><a active-link="active" href="#/info"><span translate>Information</a></li>

当我使用$("#info").hide()什么都没有发生。 有什么线索吗？

小提琴： http : //jsfiddle.net/hoqm8w70/

Answer 1

您尚未在JSFiddle演示中包含jQuery。 如果您查看JavaScript控制台，则会看到以下错误：

未捕获的ReferenceError：未定义$

要修复此问题，请从侧面的下拉列表中选择jQuery作为外部资源：

正在运行的JSFiddle演示 。

Answer 2

您没有在演示中加载jquery，请参阅fork：

$(function(){
    $("#info").hide();
}) 

https://jsfiddle.net/1565f4xL/

Answer 3

小提琴上没有加载jQuery。 加载jQuery后，它就可以工作了。

看到这个分叉的小提琴： http : //jsfiddle.net/cewqpjhm/

$( document ).ready(function() 
{
   $('#info').hide();
});

Answer 4

<ul class="ul-container">    
<li ng-if="isAuthenticated" ><a active-link="active" href="#/dashboard"><span translate>Dashboard</span></a></li>
    <li id="about"><a active-link="active" href="#/about"><span translate>About</a></li>
    <li id="info"><a active-link="active" href="#/info"><span translate>Information</a></li>
</ul>

we can use : 
$('.ul-container').hide(); or $('.ul-container').css('display', 'none');
we can have :
.hide {
   display:none;
}
js : $('.ul-container').addClass('hide');

Answer 5

我在浏览器ReferenceError上看到一些错误：$未定义，请选择js框架和扩展（jQuery框架）