jQuery Tutorial for Beginners #14 - Adding & Removing Classes

Hey gang, in this jQuery tutorial for beginners, I'll show you how we can add and remove (and toggle) HTML classes. I'll also go through a practical examaple of how toggleClass would work on a real website.

The three methods we'll look at are:

addClass()
removeClass()
toggleClass()

Any questions, shout out below :).

========== JavaScript for Beginners Playlist ==========

========== CSS for Beginners Playlist ==========

========== HTML for Beginners Playlist ==========

========== The Net Ninja ============

========== Social Links ==========

[annez]

Hi Shaun, I applied css style "display: none" to hide the section element. It also works. Why do you choose to use "height: 0; overflow: hidden"?

In script.js,
$("#lead-banner a").on("click", function(){

return false;
});

In styel.css,
.hide {
display: none;
}

[ajitsinghal]

why need these functions? we can use removeAttr() and attr() functions :/

[sunrising]

why return false i dont undestand what you say on that line....

[flammea_]

i tried so hard but i did not get why we return false ? it works without that ...

[Frankdarnese]

Is threre any particular reason why mixing vanilla javascript with jQuery like this:

var button = $("#lead-banner");
button[0].onclick = function() {

};

If I could do it much easier like this: // Option 1 - Vanilla JS //

var button = = function() {

}

or like this: // Option 2 - jQuery //

{

});

[Mustafa-cvpk]

if(false){
$("#lead-banner a").text("hide our work");
return true;
}
thank you ;)