Category: jQuery Manipulation

jQuery – Get CSS Properties jQuery css() method can be used to get the value of a CSS property associated with the first matched HTML element. Following is the syntax of the css() method: jQuery understands and returns the correct value for both css( “background-color” ) and css( “backgroundColor” ). Example Let’s try the following example and verify the result. This should…

jQuery provides various methods to get and set the CSS dimensions for the various properties. Following diagram explains how various dimensions (width, height, innerWidth, innerHeight, outerWidth, outerHeight) can be depicted for any HTML element: jQuery Dimension Methods Following are the methods to manipulate CSS dimensions for the various properties of the HTML elements. jQuery width()…

jQuery – Adding CSS Classes jQuery provides addClass() method to add a CSS class to the matched HTML element(s). Following is the syntax of the addClass() method: $(selector).addClass(className); This method takes a parameter which is one or more space-separated classes to be added to the class attribute of each matched element. More than one class may be added at…

jQuery replaceWith() Method The jQuery replaceWith() method removes the content from the DOM and inserts a new content in it’s place. Following is the syntax of the replaceWith() method: Synopsis Consider the following HTML content: Now if we apply the replaceWith() method as follows: It will produce following result: If we had any number of nested elements inside <div class=”hello”>, they…

jQuery remove() Method The jQuery remove() method removes the selected element(s) and it’s child elements from the document. Following is the syntax of the remove() method: You should use remove() method when you want to remove the element itself, as well as everything inside it. Synopsis Consider the following HTML content: Now if we apply the remove() method as follows: It will produce…

jQuery provides various methods to add new DOM elements in the existing HTML document. You can add these new elements at various locations (before, after any of the existing tags) based on your requirements. jQuery append() Method The jQuery append() method adds the content at the end of the matched each element(s). You can also append multiple…