Update examples

content/blog/2017-11-28-react-v16.2.0-fragment-support.md

@@ -37,10 +37,11 @@ render() {
   return (
     // Extraneous span element :(
     <span>
-      Text with
+      Text children
-      <a href="/foo">multiple</a>
+      <button>interleaved</button>
-      <a href="/bar">links</a>
+      with
-      inside it.
+      <button>other</button>
+      children.
     </span>
   );
 }
@@ -51,10 +52,11 @@ To address this limitation, React 16.0 added support for [returning an array of
 ```jsx
 render() {
  return [
-    "Text with",
+    "Text children",
-    <a key="link1" href="/foo">multiple</a>,
+    <button key="button1">interleaved</button>,
-    <a key="link2" href="/bar">links</a>,
+    "with",
-    "inside it."
+    <button key="button2">other</button>,    
+    "children."
  ];
 }
 ```
@@ -67,14 +69,15 @@ However, this has some confusing differences from normal JSX:
 
 To provide a more consistent authoring experience for fragments, React now provides a first-class `Fragment` component that can be used in place of arrays.
 
-```jsx{3,8}
+```jsx{3,9}
 render() {
   return (
     <Fragment>
-      Text with
+      Text children
-      <a href="/foo">multiple</a>
+      <button>interleaved</button>
-      <a href="/bar">links</a>
+      with
-      inside it.
+      <button>other</button>
+      children.
     </Fragment>
   );
 }
@@ -105,14 +108,15 @@ const Fragment = React.Fragment;
 
 Fragments are a common pattern in our codebases at Facebook. We anticipate they'll be widely adopted by other teams, too. To make the authoring experience as convenient as possible, we're adding syntactical support for fragments to JSX:
 
-```jsx{3,8}
+```jsx{3,9}
 render() {
   return (
     <>
-      Text with
+      Text children
-      <a href="/foo">multiple</a>
+      <button>interleaved</button>
-      <a href="/bar">links</a>
+      with
-      inside it.
+      <button>other</button>
+      children.
     </>
   );
 }