diff --git a/src/services/outliningElementsCollector.ts b/src/services/outliningElementsCollector.ts
index bae6bc7222c..d9d6fb6640a 100644
--- a/src/services/outliningElementsCollector.ts
+++ b/src/services/outliningElementsCollector.ts
@@ -183,6 +183,22 @@ namespace ts.OutliningElementsCollector {
                 return spanForObjectOrArrayLiteral(n);
             case SyntaxKind.ArrayLiteralExpression:
                 return spanForObjectOrArrayLiteral(n, SyntaxKind.OpenBracketToken);
+            case SyntaxKind.JsxElement:
+                return spanForJSXElement(<JsxElement>n);
+            case SyntaxKind.JsxSelfClosingElement:
+            case SyntaxKind.JsxOpeningElement:
+                return spanForJSXAttributes((<JsxOpeningLikeElement>n).attributes);
+        }
+
+        function spanForJSXElement(node: JsxElement): OutliningSpan | undefined {
+            const textSpan = createTextSpanFromBounds(node.openingElement.getStart(), node.closingElement.getEnd());
+            const tagName = node.openingElement.tagName.getText();
+            const bannerText = "<" + tagName + ">...</" + tagName + ">";
+            return createOutliningSpan(textSpan, OutliningSpanKind.Code, textSpan, /*autoCollapse*/ false, bannerText);
+        }
+
+        function spanForJSXAttributes(node: JsxAttributes): OutliningSpan | undefined {
+            return createOutliningSpanFromBounds(node.getStart(), node.getEnd(), OutliningSpanKind.Code);
         }
 
         function spanForObjectOrArrayLiteral(node: Node, open: SyntaxKind.OpenBraceToken | SyntaxKind.OpenBracketToken = SyntaxKind.OpenBraceToken): OutliningSpan | undefined {