You’re the Expert!

jquery

Cheatsheets

Change the Text of an Element using jQuery
$(document).ready(function(){
  $("#btn").click(function(){
    $("#text").text("Hello, jQuery!");
  });
});
copy to clipboard
Hide and Show Elements using jQuery
$(document).ready(function(){
  $("#hide").click(function(){
    $("#box").hide();
  });
  $("#show").click(function(){
    $("#box").show();
  });
});
copy to clipboard

Toggle an Element's Visibility
$(document).ready(function(){
  $("#toggle").click(function(){
    $("#box").toggle();
  });
});
copy to clipboard
Animate an Element using jQuery
$(document).ready(function(){
  $("#animate").click(function(){
    $("#box").animate({left: '250px'});
  });
});
copy to clipboard

Perform AJAX Request with jQuery
$(document).ready(function(){
  $("#loadData").click(function(){
    $.ajax({
      url: "https://api.example.com/data",
      method: "GET",
      success: function(response){
        $("#dataContainer").html(response);
      }
    });
  });
});
copy to clipboard
Implement jQuery UI Datepicker
$(document).ready(function(){
  $("#datepicker").datepicker();
});
copy to clipboard