Why we need jQuery?

[Gradonlee]

Tell us what’s happening:

I just learned about .addClass and .css
I mean why we can’t just change the Class and css in our code but use jQuery to accomplish it.
That’s really confused me.
Your code so far

<script>
$(document).ready(function() {
  $("#target1").css("color", "red");

});
</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 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/103.0.0.0 Safari/537.36

Challenge: jQuery - Disable an Element Using jQuery

Link to the challenge:

freeCodeCamp.org

[kevinSmith]

I’m not sure to answer. I don’t understand, when you say:

I mean why we can’t just change the Class and css in our code but use jQuery to accomplish it.

What are you referring to by “in our code”. Do you refer to HTML, CSS, or JS code there?

An important part of being a good developer is being able to write well about code.

If you are asking why you can’t just change the HTML? That wouldn’t be dynamic - you couldn’t change things at run time.

If you are asking why we couldn’t use vanilla JS? We could, it’s just a different tool.

[Gradonlee]

Thanks for your answer Kevin!

If you are asking why you can’t just change the HTML? That wouldn’t be dynamic - you couldn’t change things at run time.

yeah This is what I mean, but I still don’t know the exctly meaning about I couldn’t change things at run time.
Can I assume that we need to use jQuery functions to modify the html and css content while the page is running? What is the reason why we cannot modify the code directly? I mean when we maintain a web page, we can’t modify the code as easily as we do on IDE?

[kevinSmith]

When you point your browser at a web page, it gets sent the HTML, CSS, and JS files from the server. They then reside in your browser. How would you edit the HTML information? That is stored in the browser in the DOM. Do you expect the end user to edit the DOM for you? Will there be a programmer back at the server with a remote connect to everyone viewing their page, frantically making updates?

Can I assume that we need to use jQuery functions to modify the html and css content while the page is running?

You need something. jQ is one option. You can use vanilla JS DOM manipulation. You can use JS libraries like React or Angular that take care of those things for you. But something in the JS world has to be manipulating the DOM. HTML or CSS can’t do it.

What is the reason why we cannot modify the code directly? I mean when we maintain a web page, we can’t modify the code as easily as we do on IDE?

Sure, you can, you can change the beginning DOM. Let’s say you have a TODO list and you want it to start out with a default list of “be a good person”. You can publish that web page and everyone that loads that page will have a copy of that in their browser. If you change the original page, that won’t affect anyone until they reload the page. Furthermore, you want everyone to be able to make their own changes and make their own list. When they manipulate the DOM, they are changing only the copy in their browser. They’re creating/updating/deleting todo items on their own computer, in their own memory. They aren’t changing the original program back on the server, or in anyone else’s browser.

[Gradonlee]

Thank you very much Kevin, I may read more times to understand it.