25scripts

jQuery might feel like a relic in the age of React and Vue, but it’s still incredibly useful for quick DOM manipulation and prototyping. Here’s a breakdown of 5 simple but cool things you can do with jQuery all in just a few lines of code.

1. Easy DOM Manipulation

jQuery makes it ridiculously easy to create and update elements dynamically.

$('body').html('<button>Get Weather</button><p>Loading...</p>');

In one line, we clear the body and inject a button and paragraph. Then, we style everything using Flexbox:

$('body').css({
  display: "flex",
  flexDirection: "column",
  justifyContent: "center",
  alignItems: "center",
  height: "100vh"
});

And we hide the paragraph initially:

$('body p').css({ display: "none" });

Just like that, we’ve got a clean, centered UI.

2. Element Traversal

jQuery makes element traversal super easy. For example, selecting the children inside the body was as simple as:

$("body > *").slideDown();

3. Easy Event Handling

Handling events is also very easy with jQuery as you can see below:

$('button').click(function(){
          $('p').css({display:'block'});
            
}

4. AJAX Requests

If you need data from another app, jQuery’s ajax function can be quite handy.

 $.ajax({
              url:'https://wttr.in/London?format=3',
              method:'get',
              success:function(response){
                  $("p").html(response);
                   $("body > *").slideDown();
              },
              error:function(response){
                  $('p').html("Oops!");
              }


            });

5. Smooth Animations

Lastly, jQuery animations like slideDown() give your UI a nice quick transitions if you need that.

$("body > *").slideDown();

Conclusion

jQuery may not be the shiny new toy in the JavaScript ecosystem, but it still gets the job done and fast. With minimal setup, you can create interactive, animated, AJAX-powered pages that feel responsive and clean.

Want to try it out? Just copy the code snippet below into an .html file and open it in your browser! Happy coding!