Tengo esto
/*========== ADD NAV BACKGROUND ON CLICK ==========*/
$(document).ready(function () { //when document loads completely.
$('#hamburguer').click(function() {
$(this).addClass('solid');
});
});
/*============ NAVIGATION ============*/
.navbar {
padding: 0.7rem 1rem;
text-transform: uppercase;
font-size: 1rem;
font-weight: 700;
letter-spacing: 0.1rem;
transition: background-color 0.5s ease 0s;
}
.navbar-brand img {
height: 2rem;
}
.svg-inline--fa.fa-w-14{
color: #FFF;
font-size: 1.6rem;
}
button:focus {
outline: 1px dotted;
outline: 5px auto -webkit-focusring-color;
}
.navbar-nav li {
padding-right: 0.8rem;
display: block;
margin: 0 auto;
}
.navbar-nav .nav-link {
color: #FFF;
padding-top: 0.8rem;
}
.navbar-nav .nav-link.active,.navbar-nav .nav-link:hover{
color: #1EBBA3;
}
.navbar.solid {
background: rgba(0, 0, 0, 0.7)!important;
transition: background-color 1s ease 0s;
}
<nav class="navbar navbar-expand-lg fixed-top">
<div class="container-fluid">
<a class="navbar-brand" href="#"><img src="img/nuno.png"></a>
<button id="hamburguer" class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarResponsive">
<span class="custom-toggler-icon"><i class="fas fa-bars"></i></span>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a href="#home" class="nav-link">HOME</a>
</li>
<li class="nav-item">
<a href="#features" class="nav-link">FEATURES</a>
</li>
<li class="nav-item">
<a href="#portfolio" class="nav-link">PORTFOLIO</a>
</li>
<li class="nav-item">
<a href="#pricing" class="nav-link">PRICING</a>
</li>
<li class="nav-item">
<a href="#team" class="nav-link">TEAM</a>
</li>
<li class="nav-item">
<a href="#skills" class="nav-link">SKILLS</a>
</li>
<li class="nav-item">
<a href="#clients" class="nav-link">CLIENTS</a>
</li>
<li class="nav-item">
<a href="#contact" class="nav-link">CONTACT</a>
</li>
</ul>
</div>
</div>
</nav>
Es asi ya lo resolvi, mil gracias por tomarse el tiempo.
/*========== ADD NAV BACKGROUND ON CLICK ==========*/
$(document).ready(function () { //when document loads completely.
$('#hamburguer').click(function() {
$('.navbar').addClass('solid');
});
});