jQuery - Change the CSS of an Element Using jQuery

Are we going to be able to completely replace css.stylesheet with jQuery and bootstrap? Cause these are way easier to understand than doing it the stylesheet way. Or is there still stuff on stylesheet we cant do on these
Your code so far

<script>
  $(document).ready(function() {
    $("button").addClass("animated bounce");
    $(".well").addClass("animated shake");
    $("#target3").addClass("animated fadeOut");
    $("button").removeClass("btn-default");

  });
</script>

<!-- Only change code above this line -->

<div class="container-fluid">
  <h3 class="text-primary text-center">jQuery Playground</h3>
  <div class="row">
    <div class="col-xs-6">
      <h4>#left-well</h4>
      <div class="well" id="left-well">
        <button class="btn btn-default target" id="target1">#target1</button>
        <button class="btn btn-default target" id="target2">#target2</button>
        <button class="btn btn-default target" id="target3">#target3</button>
      </div>
    </div>
    <div class="col-xs-6">
      <h4>#right-well</h4>
      <div class="well" id="right-well">
        <button class="btn btn-default target" id="target4">#target4</button>
        <button class="btn btn-default target" id="target5">#target5</button>
        <button class="btn btn-default target" id="target6">#target6</button>
      </div>
    </div>
  </div>
</div>

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/107.0.0.0 Safari/537.36 Edg/107.0.1418.62

Challenge: jQuery - Change the CSS of an Element Using jQuery

Link to the challenge:

Oh, ok. Good to learn anyway i guess, thank you Randell

If you plan on doing any customization of appearance, you’ll still need CSS.

Bootstrap is one of many libraries that can give you a really good starting point with styling. jQuery has historically been very useful for DOM manipulation within JavaScript. However, most modern web programming favors libraries/frameworks like React, Vue, and Angular for DOM manipulation. There are styling and component libraries built to work well with these tools that will give you a more modern look and easier customization than Bootstrap.

Does DOM = domain? Ok i looked ahead and saw we’ll be jumping into React soon, are Vue and Angular also in the future lessons?

Easier customization than Bootstrap? Okay that should be interesting considering Bootstrap was already pretty nice

“DOM” is the “Document Object Model”. It refers to the way that JavaScript represents the displayed components of a web page.

The freeCodeCamp curriculum doesn’t cover Angular or Vue, but I’m sure that there are freeCodeCamp News and freeCodeCamp YouTube tutorials if you’re interested in branching out.

1 Like

Sweet, thanks yall :slight_smile:

Also i do peep the YouTube from time to time, great videos very informational!

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.