Answer by Jonny Buchanan for How to get rid of the "className" attribute in JSX?

You could write a Babel plugin for it - e.g. babel-plugin-react-html-attrs allows you to use class and for attributes when working with JSX in React and changes them to the className and htmlFor properties (JSX attributes are syntax sugar for object literals) React requires when JSX is being transpiled.

Here's the full source for a Babel 6 plugin which would change cl attributes to className when transpiling:

var TRANSLATIONS = {'cl': 'className'}module.exports = function() {  return {    visitor: {      JSXAttribute: function(node) {        if (node.node.name.name in TRANSLATIONS) {          node.node.name.name = TRANSLATIONS[node.node.name.name]        }      }    }  }}

My actual suggestion is just stick with className and you'll get used to it :)