title: JSX element 'h1' has no corresponding closing tag
body: <p>I am using Visual Studio Code to learn ReactJs, but I don't know why for HTML code I am getting "JSX element has no corresponding closing tag" error. Please see the picture.</p>
  
  <p><img src="https://i.stack.imgur.com/ilLdE.jpg" alt="enter image description here"></p>
  
  <p>Code Before I save the file in Visual Studio Code IDE</p>
  
  <pre><code>import React from 'react';
  import ReactDOM from 'react-dom';
  
  class HelloWorld extends React.Component {
      render() {
          return ( 
              &lt;h1&gt;Hello React&lt;/h1&gt;
          )
      }
  }
  
  ReactDOM.render( &lt; HelloWorld / &gt; , document.getElementById('root'));
  </code></pre>
  
  <p>Code after I save the file in Visual Studio Code IDE</p>
  
  <pre><code>import React from 'react';
  import ReactDOM from 'react-dom';
  
  class HelloWorld extends React.Component {
      render() {
          return ( &lt;
              h1 &gt; Hello React &lt; /h1&gt;
          )
      }
  }
  
  ReactDOM.render( &lt; HelloWorld / &gt; , document.getElementById('root'));
  </code></pre>