ReactJs Add Multiple Classes To Element

<!DOCTYPE html>
<html>
<head>
<title>ReactJS Tutorial, Example & Demo</title>	
<script crossorigin src="https://unpkg.com/react@16/umd/react.development.js"></script>
<script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script>
<!---this is used to compile on run time--->
<script src="https://npmcdn.com/babel-transform-in-browser@6.4.6/dist/btib.min.js"></script>

</head>
<body>
<div id="root">
</div>
<script type="text/es2015">
function MyFunction() {
  var myClasses = 'class1 class2 class3';

  return (
   <div className={myClasses}>Hello World!</div>
  );
}

ReactDOM.render(
  <MyFunction />,
  document.getElementById('root')
);
</script>
 <style>
   .class1{color:red}
   .class2{background:yellow}
   .class3{padding:10px;}
  </style>
</body>
</html>