Jquery toggle an element

toggle is a method which is used to show and hide the selected class. if select element is hidden then on toggle it will show element. If element is not hidden on toggle it will hide the element.

Output We can also specify the toggle time and function to perform task of toggle … Read more

Hide and show html elements using jquery

Hide and show function are used to show and hide any html element. Here on button click we are showing and hiding the div.

Output We can also provide how long this hide or show will take place be specifying the time like $(“.description”).hide(2000); or $(“.description”).show(2000); to perform specific task after hide or … Read more

jquery get parent id based on class value

If we have nested divs one inside another and we want to get id of parent div for this we use parents(). suppose following div structure

as above we have seen how to get id for top parent and similar we can get id or class value for any level of parent. for … Read more

Getting id and class value of a html element

We have a div and we want to get its id value based on its class value. Suppose a div is given as below and we want to fetch div id based on a button click. for getting attribute id we use attr() method. Example

Output

Changing text on mouse over event

Change text of html element on mouseover and on mouseleave event it should show original message. Example

Output:

Replacing content of div using .replaceWith()

To replace the content of a div span or any other block elements content with html element a jquery method .replaceWith() is used. Syntax:

or

A selector can be id class or tag selector of element to replace with newContent passed in .replaceWith() method. a newContent can be html string, DOM element, Array … Read more

HTML Subscript and Superscript tags

To show data in subscript and in superscript format we use <sub>..</sub> and <sup>..</sup> tags.

Example: Output: X2+Y2 H2O

HTML Bold Italic & Underline Tags

For creating bold Itelic and Underline text we use following syntax. We can also use nesting of tags Example:

Output: This is bold text This is italic text This text is underline This is bold and italic text

HTML 5 Document Structure

General HTML 5 Document Structure is as below

<!DOCTYPE html> specifies that this document is html 5 document and you can use all html5 tags here. <html> is root tag of html document it contains two child tags <head> and <body> <head> specifies that this portion contains heading information of page we can use … Read more

HTML pre tag

The pre tag is used to display preformatted text in HTML document. pre tag preserves the content structure it can be used to show pre-formated data stored in the database and in another documents and to show computer codes programs to HTML document. Syntax:

Example:

Result: Pre tag can also be used to … Read more