The removeProp() method in jQuery is used to remove a property set by the prop() method.SyntaxThe syntax is as follows −$(selector).removeProp(property)Above, the parameter property is the name of the property to remove.ExampleLet us now see an example to implement the jQuery removeProp() method − Live Demo    $(document).ready(function(){       $("button").click(function(){          var $val = $("div");          $val.prop("font-size", "1.6em");          $val.append("Property value = " + $val.prop("font-size"));          $val.removeProp("font-size");          $val.append("Property removed successfully...");       });    }); Adding ... Read More

The data() method in jQuery is used to attach data to or gets data from selected elements.SyntaxThe syntax is as follows −$(selector).data(name) $(selector).data(name, value)Above, the name is the name of data to retrieve for the 1st syntax.For the 2nd syntax, the name is the name of data to set, whereas value is the value of data to set.ExampleLet us now see an example to implement the jQuery data() method − Live Demo    $(document).ready(function(){       $(".button1").click(function(){          $("div").data("student", "Jack Sparrow");          alert("Student Name = " +$("div").data("student"));       }); ... Read More

The index() method in jQuery is used to return the index position of specified elements relative to other specified elements.SyntaxThe syntax is as follows −$(selector).index()ExampleLet us now see an example to implement the jQuery index() method − Live Demo    $(document).ready(function(){       $("li").click(function(){          document.getElementById("demo").innerHTML = $(this).index();       });    }); Devices TV Laptop Headphone Earphone SSD Index = OutputThis will produce the following output −Now, to get the index of any of the list items, just click on it as shown below. We clicked “Headphone” here −

The toggleClass() method in jQuery is used to toggle between adding or removing one or more classes from selected elements.SyntaxThe syntax is as follows −$(selector).toggleClass(classname, func(index, currentclass), switch)Above, class name specifies one or more class names to add or remove, whereas func is a function that returns one or more class names to add or remove.ExampleLet us now see an example to implement the jQuery toggleClass() method − Live Demo    $(document).ready(function(){       $("button").click(function(){          $("p").toggleClass("demo");       });    }); .demo {    background-color: orange;    color: white;   ... Read More

The removeData() method in jQuery is used to remove the data set with the data() method.SyntaxThe syntax is as follows −$(selector).removeData(name)Above, the name parameter is used to specify the name of the data to remove.ExampleLet us now see an example to implement the jQuery removeData() method − Live Demo    $(document).ready(function(){       $(".button1").click(function(){          $("div").data("student", "Jack Sparrow");          alert("Student Name = " +$("div").data("student"));       });       $(".button2").click(function(){          $("div").removeData("student");          alert("Student Name = " +$("div").data("Jack Sparrow"));       }); ... Read More

The load() method in jQuery is used to load data from a server and puts the returned data into the selected elementSyntaxThe syntax is as follows −$(selector).load(url, data, function(response, status, xhr))Above, URL is the URL to be loaded. The data parameter is the data to send to the server, whereas the callback function runs when the load() completes.ExampleLet us now see an example to implement the jQuery load() method − Live Demo    $(document).ready(function(){       $("button").click(function(){          $("div").load("new.txt");       });    }); Demo text... Load Content ... Read More

The replaceAll() method in jQuery is used to replace selected elements with new HTML elements.SyntaxThe syntax is as follows −$(content).replaceAll(selector)Above, the content parameter is the content to insert, whereas the selector specifies which elements to be replaced.ExampleLet us now see an example to implement the jQuery replaceAll() method − Live Demo    $(document).ready(function(){       $("button").click(function(){          $("New Heading").replaceAll("h2");       });    }); div {    margin: 10px;    width: 60%;    border: 2px dashed orange;    padding: 5px;    text-align:justify; } Demo Heading 1 Demo ... Read More

The show() method in jQuery is used to display the hidden element.SyntaxThe syntax is as follows −$(selector).show(speed, easing, callback)Above, the parameter speed is the speed of the show effect, whereas easing is the speed of the element in different points of the animation. The callback function is a function that executes after the show() method completes.Let us now see an example to implement the jQuery show() method −Example Live Demo    $(document).ready(function(){       $(".btnhide").click(function(){          $("p").hide();       });       $(".btnshow").click(function(){          $("p").show();       }); ... Read More

The ready() method in jQuery occurs when DOM has been loaded.SyntaxThe syntax is as follows −$(document).ready(func)Above, func specifies the function to run after the document is loaded.ExampleLet us now see an example to implement the jQuery ready() method − Live Demo div {    width:600px; } .demo * {    display: block;    background-color;    border: 2px solid yellow;    color: blue;    padding: 10px;    margin: 10px; }    $(document).ready(function(){       $("li.test").siblings().css({"background-color": "orange", "color": "white", "border": "3px dashed blue"});    }); Demo Heading ul (parent) previous sibling previous sibling ... Read More

The element ~ siblings selector in jQuery is used to select all elements that are siblings of the specified "element".SyntaxThe syntax is as follows −("ele ~ siblings")Above, the parameter ele is any valid selector, whereas siblings are the siblings of the ele parameter.ExampleLet us now see an example to implement the jQuery element ~ siblings selector − Live Demo    $(document).ready(function(){       $("div ~ p").css("color", "orange");    }); div {    border:1px solid black;    padding:10px; } Demo Heading This is demo text. span outside p element This is demo text. ... Read More