jQuery Selector is a funcion that enables you to find DOM (Document Object Model) elements in your webpage. jQuery statements use the "$" as prefix to identify the following statements as after most jQuery statements tend to be a combination of selector and action: $(selector expression).action();

Selectors can be an element name, class name, id, or use keyword "this".

Actions are defined within the jQuery library but also include: attaching event handlers, css mannipulation and DOM property retrieval.


See the Pen selectors by Towa (@badsmiles) on CodePen.


jQuery has several methods for CSS manipulation. When methods such as text(), html(), attr(), and val() are called with no argument, it is referred to as getters because its essentially getting the values of the element, as for methods that called with a value as an argument, it is referred to as setters because it is setting the values for the element.


See the Pen get set by Towa (@badsmiles) on CodePen.


The jQuery library enables various effects and animations that can be added on a webpage. The 3 basic pairs of effects that allow elements to display or hide include:

  • show() & hide()
  • fadeIn() & fadeOut
  • slideDown() & slideUp()


See the Pen ZEGZPQX by Towa (@badsmiles) on CodePen.