My problem is that I can not use jquery in my js files, even though it is already integrated in html and even works with bootstrap. Try including JQuery before and after the JS but it is not solved.
class User {
contructor(name,pass){
this.name = name;
this.pass = pass;
}
dis(){
//$('.navbar').fadeOut();
}
}
var u = new User();
u.dis();
$('.navbar').fadeOut();<!DOCTYPE html>
<html lang="es">
<head>
<base href="http://localhost/FreedomWallpapers/" target="_blank">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<title></title>
<!-- Bootstrap core CSS -->
<link href="views/libs/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="views/app/css/hometemplate.css" rel="stylesheet">
</head>
<header>
<nav class="navbar navbar-toggleable-md navbar-light fixed-top bg-faded" >
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<a class="navbar-brand" href="#">Freedom Wallpapers</a>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item">
<a class="nav-link" href="#">Inicio<span class="sr-only"></span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Categorias</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Perfil</a>
</li>
</ul>
<form class="form-inline my-2 my-lg-0">
<button class="btn btn-outline-success my-2 my-sm-0 mx-auto" type="button" data-toggle="modal" data-target="#loginFormModal">Login</button>
<!-- Modal -->
<div class="modal fade" id="loginFormModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Iniciar Sesion</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<div class="container">
<form>
<div class="form-group row">
<label for="inputEmail3" class="col-sm-2 col-form-label">Email</label>
<div class="col-sm-10">
<input type="email" class="form-control" id="logEmail" placeholder="Email">
</div>
</div>
<div class="form-group row">
<label for="inputPassword3" class="col-sm-2 col-form-label">Password</label>
<div class="col-sm-10">
<input type="password" class="form-control" id="logPassword" placeholder="Password">
</div>
</div>
<div class="form-group row">
<div class="col-sm-12">
<div class="form-check">
<label class="form-check-label">
<input class="form-check-input" type="checkbox"> Recordarme
</label>
</div>
</div>
</div>
<button type="button" class="btn btn-outline-success float-right" id="loginButton">Ingresar</button>
<button type="button" class="btn btn-outline-warning float-right mr-2" id="registerButton">Registrarse</button>
</form>
</div>
</div>
</div>
</div>
</div>
</form>
</div>
</nav>
</header>
<script src="views/app/js/login.js" charset="utf-8"></script>
<body>
<section class="homeSection">
<div class="container">
<div class="welcomeText">
<h2>Freedom Wallpapers</h2>
<h5>El mejor sitio para descargar wallpapers.</h5>
</div>
</div>
</section>
<section class="randomSection bg-inverse">
<div class="container">
<p class="text-white">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p class="text-white">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
</div>
</section>
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="https://code.jquery.com/jquery-3.1.1.slim.min.js" integrity="sha384-A7FZj7v+d/sdmMqp/nOQwliLvUsJfDHW+k9Omg/a/EheAdgtzNs3hpfag6Ed950n" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/tether/1.4.0/js/tether.min.js" integrity="sha384-DztdAPBWPRXSA/3eYEEUWrWCy7G5KFbe8fFjk5JAIxUYHKkDx6Qin1DkWx51bBrb" crossorigin="anonymous"></script>
<script src="views/libs/bootstrap/js/bootstrap.min.js"></script>
</body>
</html>