jQuery is About Selecting & Doing!

What is jQuery all about?

jQuery is about selecting "finding" some DOMs "HTML elements" and doing something with them.

jQuery is Mainly something like this

$("Selector").do( parameters... );

Selector

is basically a search criteria based on which jQuery finds "0 or more" DOM or HTML elements. This is usually called selector.

   $("div") // --> finds all elements of type div
    $("#elementId") //--> finds the element with the id="elementId"
    $(".someClass") //--> finds the element with the CSS class ".someClass"
    

do

is an action you want to implement on the selected HTML elements e.g. "changing element background color", or you want an HTML element to do when an event occurs e.g. when a user clicks that element

   // --> the "do" here is to return the width()
    $("div").width() 
    
    //--> the "do" here is to set the text to "some text"
    $("#elementId").text("some text") 
    
    //--> the "do" here is to add "anotherClass" CSS class to the element
    $(".someClass").addClass("anotherClass")    
    

parameters...

Based on the type of the "do", you may need to pass values, handler function or nothing. We have seen example of passing value e.g. $("#elementId").text("some text") and passing nothing $("div").width(). Below is an example of passing handler function.

   // the "handler" here is a function that shows alert window when user click selected element.
    $("div").click( function() { alert("clicked") } ) 
    

There are some exceptions to this rule which will be coverd later. But mainly the rest of this tutorial is about learning how to select & what can you do with the selection

jQuery basic