Web/Javascript/JQuery.md

@@ -46,6 +46,7 @@ $('body').html("Hello world!"); //equivalent of innerHTML
 $('body').find('.test'); //find every elements that match the .test class
 $('body').children('.solid'); //take every children of the body that have the class .solid
 $('.solid').addClass('highlight'); //add the class highlight to every object with .solid class
+.toggleClass(); Can switch on/off classes
 .last() //last element
 .prev() //previous element
 .next() //next element
@@ -53,3 +54,25 @@ $('.solid').addClass('highlight'); //add the class highlight to every object wit
 .parents() //get all the parents of the element
 .closest('class'); //get the closest element that have the class
 ```
+
+```javascript
+//Events
+$(.box').on('click', function(){ //equivalent of AddEventListener()
+  console.log("Hello");
+  $(this); //refers to the .box
+});
+
+$(.box').on('click', '.box-button', function(){ //equivalent of AddEventListener()
+  console.log("Hello");
+  $(this); //with 3 parameters, the 2nd parameter delegate the $(this) to the new said element
+});
+```
+
+```javascript
+//If data attributes
+.data('price'); //to retrieve the data attribute 'data-price' of the html element.
+```
+
+* Data-attributes : https://developer.mozilla.org/en-US/docs/Learn/HTML/Howto/Use_data_attributes
+
+