Original:
<div id="test">
...
</div>
After appending:
<div id="test">
...
<img src=".." />
</div>
After removing:
<div id="test">
...
</div>
jQuery uses: . append(); and . remove(); functions to accomplish this task. We could use these methods to append string or any other html or XML element and also remove string and other html or XML elements from the document.
To remove an image bind the click event on the class='delete' . On click select the image source and display confirmation alert. If OK button gets clicked then send an AJAX request where pass the path with a request: 2 . If response is 1 on successful callback then remove the <div > container.
To remove elements and content, there are mainly two jQuery methods: remove() - Removes the selected element (and its child elements) empty() - Removes the child elements from the selected element.
jQuery remove() Method The remove() method removes the selected elements, including all text and child nodes. This method also removes data and events of the selected elements. Tip: To remove the elements without removing data and events, use the detach() method instead.
// add
$("#test").append("<img src='...' />")
// remove
$("#test img:last-child").remove()
$('div#test').append('<img src=".."/>');
$('div#test > img').remove();
Note that you can give the image a class as well, in case you only want to remove the one you added.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With