In this post, we are going to see jQuery html method.
Live demo:Jquery html method example on jsbin.com
html method is used to get html content of first matched elements, other elements will be ignored and html(‘new html content’) is used to set html content for all matched elements.
Syntax for html() :
|
1 2 3 4 5 |
$("selectors").html() Example : $("div").html(); |
Syntax for html(‘new html content’) :
|
1 2 3 4 5 |
$("selectors").html('new html content') Example: $("div").html('this text is being set by html method'); |
Let’s understand with the help of example:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 |
<title>Jquery html method example </title> <script src="http://code.jquery.com/jquery-2.2.3.min.js"></script> <h2>Jquery html method example</h2> <style> .blackBorder{ border:4px dotted black; </style> <script type="text/javascript"> $(document).ready(function(){ $("#htmlButton").click(function(){ alert($("div").html()) ; }); $("#setHtmlButton").click(function(){ $("div").html('this text is being set by html() method'); }); $("#reset").click(function(){ location.reload(); }); }); </script> <button id="htmlButton">Using html</button> <button id="setHtmlButton">Using html('new html content') </button> <button id="reset">Reset</button> <br> <div class="blackBorder"> Hello world from java2blog!!!! </div> <br> <div class="blackBorder"> Welcome to JQuery. </div> |
Was this post helpful?
Let us know if this post was helpful. Feedbacks are monitored on daily basis. Please do provide feedback as that\'s the only way to improve.
