I tried:
but it didn
No, you can't add a starting and ending commend tag like that. The comment tag is a single tag, it's not a seprate starting tag and ending tag. So, <!--
and -->
are not a valid HTML fragments, as they don't contain complete tags.
If you want to put an element inside a comment, it's no element any more, so to do that you would have to get the HTML code for the element, put a comment tag around it, and replace the element with the comment.
If you do this to hide the element, you should simply use the hide
method instead.
pls use .html() to add html content dynamically
eg:
$(.dv).click(function(){
$(".dy").html("abcd");
});
<div class=".dy" >
</div>
try it and hope it will work for you
You're mixing two completely unrelated concepts there: HTML and the DOM.
HTML is a textual means of describing content, which — like code — has a means of commenting things out. The DOM is the resulting object model in the browser.
Once the HTML has been read and parsed and the DOM has been created, the HTML is discarded and unnecessary. Adding HTML comments to things won't change them, and in fact doesn't make sense (although it's easy to see how you thought it would, don't get the wrong idea).
Once you have the DOM, to hide an element without removing it, use hide. To remove it entirely, use remove.
Live examples of both: http://jsbin.com/araju
Using .hide() is a better way to achieve what you want. Also worth mentioning that comment objects are part of the DOM so in theory you could manipulate them (or add new ones) using jQuery.
It looks like you're trying to make objects with .class
disappear. Use .hide()
instead. Comments are only parsed when the browser first loads the page, so adding comments won't comment something out.
You need to learn the difference between HTML and the DOM. HTML is the textual representation of the page, but the browser parses it into the DOM on page load. JavaScript works on the DOM, not on the HTML. Using .innerHtml()
on DOM elements reparses the HTML.
Here's an example of using innerHtml()
to hide elements using HTML comments (but note that I would never do this - I'm only showing how to do what it looked like you were trying to do in your question):
HTML:
<h1>hello</h1>
<div>
<p>wow</p>
<p>dude</p>
</div>
JavaScript (+ jQuery):
$(document).ready(function () {
setTimeout(hideIt, 1000);
});
function hideIt() {
$('div').html('<!--' + $('div').html() + '-->');
}
To provide a more direct answer, use:
var gonee = $('.myclass');
$('.myclass').replaceWith('<!--' + gonee + '-->');
see me in action: http://jsfiddle.net/YNe6w/1/