JQuery HTML

html in jquery

JQuery html method is used to change the entire content of the selected elements. It replaces the selected element content with new contents.

The first method signature has no argument, so it just returns the HTML within that element. The remaining two signatures take a single argument: i.e. a string or a function that returns a string.

Syntax:

i) $(selector).html()
It is used to return content.

ii) $(selector).html(content)
It is used to set content.

iii) $(selector).html(function (index, currentcontent))
It is used to set content by calling function.

The jQuery html() method is used either for set the content or return the content of the selected elements.

To set content: When you use this method to set content, it overwrites the content of the all matched elements.

To return content: When you use this method to return content, it returns the content of the first matched element.


Parameters of jQuery html() method:

   Parameter         Description
ContentIt is an essential parameter. It is used to specify the new content for the selected elements. It can also contain HTML tags.
Function (index, currentcontent)It is an optional parameter. It specifies a function that returns the new content for the selected elements.

Index: It shows the index position of the element in the set.

Current content: It shows the current HTML content of the selected element.

Example of jQuery html() method:

<!DOCTYPE html>
<html>
<head>
<script src=”https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js”></script>
<script>
$(document).ready(function()
{
    $(“button”).click(function()
{
        $(“p”).html(“Hello <b>Edusite.com</b>”);
    });
});
</script>
</head>
<body>

<p>This is a paragraph.</p>
<p>And This is another paragraph.</p>
</body>
</html>

Output:

This is a paragraph.
And This is another paragraph.

Spread the love

Leave a Comment

Your email address will not be published. Required fields are marked *