jQuery document-ready event Attaching events and manipulating the DOM inside ready()

Help us to keep this website almost Ad Free! It takes only 10 seconds of your time:
> Step 1: Go view our video on YouTube: EF Core Bulk Extensions
> Step 2: And Like the video. BONUS: You can also share it!

Example

Example uses of $(document).ready():

  1. Attaching event handlers
    Attach jQuery event handlers
$(document).ready(function() {
  $("button").click(function() {
    // Code for the click function
  });
});
  1. Run jQuery code after the page structure is created
jQuery(function($) {
// set the value of an element.
   $("#myElement").val("Hello");
});
  1. Manipulate the loaded DOM structure
    For example: hide a div when the page loads for the first time and show it on the click event of a button
$(document).ready(function() {
  $("#toggleDiv").hide();
  $("button").click(function() {
    $("#toggleDiv").show();
  });
});


Got any jQuery Question?