this is my code...append is working but removing is not working. how to remove the appended div?
<html>
<head>
<script type="text/javascript">
function view(){
$('body').append('<div class="added"><p>something</p></div>');
};
function close(){
$('.added').remove();
} ;
</script>
</head>
<body>
<a onclick="view();">something</a>
<a onclick="close();">close</a>
</body>
</html>
this is my code...append is working but removing is not working. how to remove the appended div?
<html>
<head>
<script type="text/javascript">
function view(){
$('body').append('<div class="added"><p>something</p></div>');
};
function close(){
$('.added').remove();
} ;
</script>
</head>
<body>
<a onclick="view();">something</a>
<a onclick="close();">close</a>
</body>
</html>
- i wrote diff code by mistake..this is my code right now..which is not working – user1531746 Commented Aug 10, 2012 at 12:00
2 Answers
Reset to default 7Specify window.close in your html handler:
<a onclick="window.close();">close<a>
http://jsfiddle/ZTwd7/1/
Otherwise close() refers to the native close method, which doesn't do anything.
Here's how you would emulate it with a "javascript" (as opposed to inline html attribute) handler:
elem.onclick = function(event) {
with(Window.prototype) {
with(document) {
with(this) {
close();
}
}
}
};
This is not exact reproduction (nor does it work in IE etc, that's not the point) but it would put the .close in Window.prototype in front of the global window.close in the scope, so it shadows it. You can still refer to it explicitly with window.close().
You should also totally drop the above and use jQuery instead:
<a id="view">something<a>
<a id="close">close<a>
JS:
$(function() {
$("#view").click(function() {
$('body').append('<div class="added"><p>something</p></div>');
});
$("#close").click(function() {
$('.added').remove();
});
});
http://jsfiddle/ZTwd7/5/
Making an ajax request that fetches a html file to be appended:
$.get("myhtml.html", function(html) {
$("body").append(html);
}, "html");
Don't know why but by putting another name to close function instead of close() it works
<html>
<head>
<script src="http://code.jquery./jquery-latest.js"></script>
<script type="text/javascript">
function view(){
$('body').append('<div class="added"><p>something</p></div>');
};
function close_it(){
$('.added').remove();
} ;
</script>
</head>
<body>
<a onclick="view();">something<a>
<a onclick="close_it();">close<a>
</body></html>