remove legacy `hx-on=` syntax

2 files changed, 19 insertions, 12 deletions

diff --git a/www/content/attributes/hx-on.md b/www/content/attributes/hx-on.md
index 60a13725..2934fd4d 100644
--- a/www/content/attributes/hx-on.md
+++ b/www/content/attributes/hx-on.md
@@ -9,23 +9,15 @@ The `hx-on*` attributes improve upon `onevent` by enabling the handling of any a
 for enhanced [Locality of Behaviour (LoB)](/essays/locality-of-behaviour/) even when dealing with non-standard DOM events. For example, these
 attributes allow you to handle [htmx events](/reference#events).
 
-There are two forms of `hx-on` attributes:
-
-* In the primary form, you specify the event name as part of the attribute name, after a colon.  So, for example, if
-  you want to respond to a `click` event, you would use the attribute `hx-on:click`.
-
-* The second, deprecated form, uses the `hx-on` attribute directly. This latter form should only be used if IE11 support
-  is required, and will be removed in htmx 2.0
-
-### hx-on:* (recommended)
-
-In this form, the event name follows a colon `:` in the attribute, and the attribute value is the script to be executed:
+With `hx-on` attributes, you specify the event name as part of the attribute name, after a colon.  So, for example, if
+you want to respond to a `click` event, you would use the attribute `hx-on:click`:
 
 ```html
 <div hx-on:click="alert('Clicked!')">Click</div>
 ```
 
-Note that, in addition to the standard DOM events, all htmx and other custom events can be captured, too! 
+Note that this syntax can be used to capture all htmx events, as well as most other custom events, in addition to the
+standard DOM events.
 
 One gotcha to note is that DOM attributes do not preserve case. This means, unfortunately, an attribute like
 `hx-on:htmx:beforeRequest` **will not work**, because the DOM lowercases the attribute names.  Fortunately, htmx supports
diff --git a/www/content/docs.md b/www/content/docs.md
index 975db01f..1ec6486d 100644
--- a/www/content/docs.md
+++ b/www/content/docs.md
@@ -183,6 +183,21 @@ To upgrade to htmx 2.0 from htmx 1.0, you will need to do the following:
     `htmx.config.methodsThatUseUrlParams` to `["get"]` (it's a little crazy, but `DELETE`, according to the spec, should
      use request parameters.)
   * If you want to make cross-domain requests with htmx, revert `htmx.config.selfRequestsOnly` to `false`
+* Convert any `hx-on` attributes to their `hx-on:` equivalent:
+  ```html
+     <button hx-get="/info" hx-on="htmx:beforeRequest: alert('Making a request!')
+                                   htmx:afterRequest: alert('Done making a request!')">
+      Get Info!
+     </button>
+  ```
+  becomes:
+  ```html
+     <button hx-get="/info" hx-on:htmx:before-request="alert('Making a request!')"
+                            hx-on:htmx:after-request="alert('Done making a request!')">
+      Get Info!
+     </button>
+  Note that you must use the kebab-case of the event name due to the fact that attributes are case-insensitive in HTML.
+  ```
 
 here is a meta tag to revert to htmx 1.x defaults: