Update docs examples so they don't use deprecated features, styling tweaks (#982)

* Deprecate pyscript output attribute

* Update code blocks so they work

* Small tweaks to styling and use html to warning

* Fix broken test from bad conflict resolution

* lowercase pyodide

docs/reference/API/display.md

@@ -1,6 +1,6 @@
-#### `display(*values, target=None, append=True)`
+# `display(*values, target=None, append=True)`
 
-**Parameters:**
+## Parameters
 
 `*values` - the objects to be displayed. String objects are output as-written. For non-string objects, the default content to display is the the object's `repr()`. Objects may implement the following methods to indicate that they should be displayed as a different MIME type. MIME types with a * indicate that the content will be wrapped in the appropriate html tags and attributes before output:
 
@@ -21,13 +21,13 @@
 
 `append` - `boolean` if the output is going to be appended or not to the `target`ed element. It creates a `<div>` tag if `True` and a `<py-script>` tag with a random ID if `False`. The default value for `append` is `True`.
 
-**Description:**
+### Description
 
 Display is the default function to display objects on the screen. Functions like the Python `print()` or JavaScript `console.log()` are now defaulted to only appear on the terminal.
 
 Display will throw an exception if the target is not clear. E.g. the following code is invalid:
 
-```
+```html
 <py-script>
     def display_hello():
         # this fails because we don't have any implicit target
@@ -39,4 +39,15 @@ Display will throw an exception if the target is not clear. E.g. the following c
 
 Because it's considered unclear if the `hello` string should be displayed underneath the `<py-script>` tag or the `<button>` tag.
 
-To write compliant code, make sure to specify the target using the `target` parameter.
+To write compliant code, make sure to specify the target using the `target` parameter, for example:
+
+```html
+<py-script>
+    def display_hello():
+        # this fails because we don't have any implicit target
+        # from event handlers
+        display('hello', target="helloDiv")
+</py-script>
+<div id="helloDiv"></div>
+<button id="my-button" py-onClick="display_hello()">Click me</button>
+```