Skip to content

Instantly share code, notes, and snippets.

@ergurjeetsingh

ergurjeetsingh/addparagraph.html

Created June 14, 2018 16:47
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save ergurjeetsingh/5ad43dc5361c4778d04ead69479548e6 to your computer and use it in GitHub Desktop.
Save ergurjeetsingh/5ad43dc5361c4778d04ead69479548e6 to your computer and use it in GitHub Desktop.
Download ZIP
Add paragraph and change Image
Raw
addparagraph.html
<!DOCTYPE html>
<html>
<head>
<script src="jquery-3.3.1.js"></script>
<link rel="stylesheet" type="text/css" href="css/bootstrap.css">
<title>Add to paragraph</title>
</head>
<body>
<section>
<div class="container">
<div class="row pb-5 pt-5">
<div class="col-6">
<div class="mb-5">
<input id="name" type="text" class="form-control" placeholder="Enter Name">
</div>
<div class="mb-5">
<button class="btn-add">Add to paragraph</button>
</div>
<div id="apend" class="p-5 border border-primary">
<p class="text-success"></p>
</div>
</div>
<div class="col-6">
<div class="mb-5">
<img class="myimage" src="download.jpg">
</div>
<div>
<button id="btn-changeimg">Change Image</button>
</div>
</div>
</div>
</div>
</section>
<script type="text/javascript">
$(document).on('click','.btn-add',function(){
paragraph = $ ('#name').val();
$('#apend>p').append(paragraph);
$('#name').val("");
});
$(document).on('click','#btn-changeimg',function(){
$('.myimage').attr('src','2.jpg');
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment