jQuery .html() method

The jQuery html() method is used set or get the content (texts with HTML codes) of selected elements. You can use this method when you want to add HTML code along with the content or a text value to elements.

Syntax of .html() Method

To return content:

$(selector).html()

To set content:

$(selector).html(content)

➡️ text() method

Example

Let us assume, I have a label control and I want to change the text along with the markup of the label dynamically. Here's what I'll do.

<body>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>

  <input type="text" id="emp" value="" />
  <p><input type="button" id="bt" value="Change Label Text" /></p>
  <label id="lblEmp">N/A</label>
</body>

<script>
 $(document).ready(function () {
    $('#bt').click(function () {
      let empName = $('#emp').val();
      $('#lblEmp').html('Hello <span style="text-transform:capitalize;">' + empName + '</span>');
    });
  });
</script>
</html>

Try it

➡️ jQuery Methods