How to change the inner data of html tag by using the .html() methods?

Asked 28-Jul-2021
Viewed 140 times

1 Answer


1

jQuery html() method used to change the whole content of the selected elements. it change the content of selected elements with new html data.

Syntax
 $(selector).html ()
  Return inner html of selected elements
 $(selector).html (content)
  Set inner html of the selected elements
 $(selector).html (function (index, content))
  Also set the inner html of selected elements by calling the function
<!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 () {
                $('.div1').html('Hello !!! i am added in div tag by using the html tag');
            });
        });
    </script>
    <style>
        .div1 {
            margin:10px;
            padding:10px;
            width:200px;
            height:200px;
            background-color:black;
            color:white;
        }
    </style>
</head>
<body>
    <button>Click me</button>
    <div class='div1'>
    </div>
</body>
</html>

How to change the inner data of html tag by using the .html() methods?