title: ReactJs: Invalid DOM property `classname` error
body: <p>I am parsing a HTML string to React.js and render it as HTML element using "ReactHtmlParser" suggested in that previous post <a href="https://stackoverflow.com/questions/52556583/react-js-raw-html-string-does-not-gets-recognized-as-html-elements-from-node-js">React.js: Raw HTML string does not gets recognized as HTML elements from Node.js</a>. 
  Now, I am trying add Bootstrap style attribute on it, by doing the following:</p>
  
  <pre><code>app.get('/myCart', (req, res) =&gt; {
    var data;
    var htmlString ="";
    var total = 0;
  
    MongoClient.connect(url, { useNewUrlParser: true }, function(err, db) {
      if (err) throw err;
      var dbo = db.db("cart");
      dbo.collection("items").find().toArray(function(err, result) {
        if (err) throw err;
        console.log("here")
        data = result
        for(let item of data){
          htmlString += "&lt;div className=\"row\"&gt;&lt;div className=\"col\"&gt;" + item.desc + "&lt;/div&gt;" + "&lt;div className=\"col\"&gt;" + item.price + "&lt;/div&gt;&lt;/div&gt;"
          total += item.price
        }
        console.log("total is" + total)
        htmlString +="&lt;div className=\"row\"&gt;&lt;div&gt;" + total + "&lt;/div&gt;&lt;div&gt;"
        console.log(htmlString)
        res.send({express: htmlString})
        db.close();
      });
    });
  </code></pre>
  
  <p>My render method:</p>
  
  <pre><code>render(){
      console.log(this.state.cartData)
      return(
          &lt;div className="col"&gt;
              &lt;div&gt;{ReactHtmlParser(this.state.cartData)}&lt;/div&gt;
          &lt;/div&gt;
      )
  }
  </code></pre>
  
  <p>As you can see, it is actually <code>className</code> not <code>classname</code>. However, when I render it to front-end, it got error saying that <code>Invalid DOM property classname. Did you mean className</code> </p>
  
  <p>I really have no idea because I only put className as attribute.  Does it have to do with ReactHtmlParser?</p>