You may find that certain Divi Theme features stop working correctly when you upgrade to WordPress 4.5. For instance you may find that your sliders don't slide, or your images don't show. This post explains how to solve it.

What's the problem?

The problem is that older versions of Divi used a common, but incorrect, bit of jQuery code. This code, found at (approximately) line 706 of Divi's js/custom.js, file reads:

$( 'a[href*=#]:not([href=#])' ).click( function() {

The code incorrectly has no quotation marks around the hash (#) symbols. Until now this was not a problem as the jQuery library happily overlooked this slight mistake.

WordPress 4.5, however, now loads an updated version of the jQuery library which is not so generous. The library, on seeing the code above triggers a JavaScript error, like so:

To see if you're affected by this, load your site in Google Chrome and then click ctrl-shift-j to bring up the JavaScript console. If you're affected above, you'll see the message:

Uncaught Error: Syntax error, unrecognized expression: a[href*=#]:not([href=#])

This JavaScript error has the knock-on effect of stopping Divi's other JavaScript code from running, which it needs to animate your sliders, load your images, etc.

How can I fix it

The simplest way to fix this is to update to the Divi 2.7.3 (or later), as Elegant Themes have fixed the issue in this version.

If for some reason you are unable to update, you can manually fix the issue by modifying the affected line in js/custom.js to read:

$( 'a[href*="#"]:not([href="#"])' ).click( function() {

While it's not normally advisable to edit Divi's core files as they will be overridden by updates, in this case it is okay as a subsequent update will apply Elegant Themes' fix and remove the need for your manual edit.