JSFiddle - React, Tailwind, and code Playground

by i nenu love nennu

HTML

<p id="changeHtml">This is the text i want to change</p>
<input type="button" id="mybutton" value="change HTML">
    
    <input type="button" value="append text" id="myappend">
    <input type="button" value="prepend text" id="myprepend">
        
    <input type="button" value="remove text" id="myremove">

JavaScript

$(document).ready(function(){

//alert('hello sudheer');
// html() method is used to change the html content
    
    $("#mybutton").click(function(){
        
      $("#changeHtml").html("<b>this is my bold text</b>")
   
    });
    
    
    //
    $("#myappend").click(function(){
    // add the content after  
   $("#changeHtml").append("<h2> appended text </h2>")
 
    });
    
    //adds the text before content
    $("#myprepend").click(function(){
      
      $("#changeHtml").prepend("<h1>adding the content before</h1>");
      
      });
    
    
    // remove the content with the specified id
    
    $("#myremove").click(function(){
        
        $("#changeHtml").remove();
    });

});