Home

Using jQuery and CoffeeScript in WordPress

The standard ready function doesn't always work in WordPress plugins. Here's a workaround.

If you're properly enqueuing scripts and styles into your WordPress plugins and themes, you may have noticed this doesn't work:

$(document).ready(function () {
alert($(".container").length);
});

jQuery

The solution, using jQuery, is this:

jQuery(document).ready(function ($) {
alert($(".container").length);
});

You have to pass the $ to the ready function before you can effectively use it.

CoffeeScript

The CoffeeScript equivalent to this is:

jQuery(document).ready ($) ->
alert $('.container').length;

Short, simple, but a frustration saver.

Let's Connect

Keep Reading

Animating Dots Using HTML5 Canvas

This builds on a previous example and brings some movement to our dots!

Feb 27, 2016

Should You Learn jQuery in 2022?

It may seem like jQuery has been dead for years, but it is still widely used in 2022. But should you take the time to learn it?

Jul 22, 2022

Create a Multi-Colored, Dotted Grid with HTML5 Canvas

The wide world of canvas is open-ended. Here's a fun example to dig in and learn some of the basics of HTML5 canvas.

Feb 26, 2016