xxxxxxxxxx
let flag = false;
const toggle = () => {
if ( flag ) {
// insert code here when flag is on/true
} else {
// insert code here when flag is off/false
}
flag = ! flag;
}
xxxxxxxxxx
document.querySelector('.show-more').addEventListener('click', function () {
document.querySelector('.additional-information')
.classList.toggle('is-visible');
});
xxxxxxxxxx
<button id="btn"> Click </button>
<p class="demo">YES</p>
<script>
let btn = document.querySelector("#btn");
btn.addEventListener("onclick", function() {
let value = document.querySelctor("#demo").innerHTML;
if(value == "YES"){
document.querySelctor("#demo").innerHTML = "NO";
}else{
document.querySelctor("#demo").innerHTML = "YES";
}
});
</script>
xxxxxxxxxx
<input type="button" id="myButton" value="NO" onclick="Buttontoggle();">
function Buttontoggle()
{
var t = document.getElementById("myButton");
if(t.value=="YES"){
t.value="NO";
} else if(t.value=="NO"){
t.value="YES";
}
}
xxxxxxxxxx
<!DOCTYPE HTML>
<html>
<head>
<style>
.first {
color: green;
}
.second {
color: red;
}
</style>
</head>
<body>
<div id="demo" class="first">Welcome To My Domain</div>
<footer>
<small>Have a Nice Day <a href="www.google.com">Gud day</a></small>
</footer>
<script>
function third() {
this.classList.toggle('first');
this.classList.toggle('second');
}
document.querySelector('#demo').addEventListener('click', third);
</script>
</body>
</html>