CODEWITHSUNDEEP
javascriptjqueryhtml
Awan
Awan

Reputation: 18560

How to remove element using specific id

I have html like this:

<html>
   <input type='button' name='button1' id='button1'>
   <input type='button' name='button2' id='button2'>
</html>

What I want to do that when User click button2, it should remove button1 element and show a message on its place. It will look like this after button2 click event.

<html>
   Button1 Removed
   <input type='button' name='button2' id='button2'>
</html>

Upvotes: 0

Views: 340

Answers (6)

Piotr Kula
Piotr Kula

Reputation: 9811

Using jQuery with an embedded function that can also do other things.

$('#button2').click(function() {  $('#button1').remove().html('<p>Button 1 Removed</>')  });

Remember its good practice to always enclose text in some tags like etc

Upvotes: 1

Ergec
Ergec

Reputation: 11824

$(document).ready(function(){
    $("#button2").click(function(){
        $("#button1").replaceWith("Button1 Removed");
    });
});

Upvotes: 1

Abdul Kader
Abdul Kader

Reputation: 5842

$('#button1').click(function() { 
 $('this').remove().html('<p>Button 1 Removed</>') 
 alert('button1 removed'); 
});

Upvotes: 1

Eric T
Eric T

Reputation: 1026

If you were using jquery then this solution:

$('#button2').click(function(){
  $('#button1').replaceWith('<p>Button1 Removed</p>');
});

Upvotes: 1

Peeter
Peeter

Reputation: 9382

$(document).ready(function(){
    $("#button1").click(function(){
        $("#button1").replaceWith("<div>Hi der</div>");
    });
});

Upvotes: 1

tito
tito

Reputation: 13251

If you use jquery, you can do that:

$('#button2').click(function() {
  $('#button1').replaceWith('Button1 Removed')
});

Upvotes: 1

Related Questions