Code Editor

Chrome Cobalt Monokai Dreamweaver Vibrant Ink

<!DOCTYPE html> <html> <head> <title>Learning jQuery</title> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script> </head> <body> <button>Add Marker</button> <div id="container"> <h1>Heading</h1> <p>This is a paragraph with some dummy text in it.</p> </div> </body> </html>

img{ width: 15px; display: inline-block; } h1{ display: inline; }

$(document).ready(function(){ // Add content after an element with ID container $("#container").after("<p>— The End —</p>"); // Add content after headings $("button").click(function(){ $("h1").after('<img src="images/marker-right.png" alt="Symbol">'); }); });