First attempt at render React component in new div

first.js

import React from 'react';
import ReactDOM from 'react-dom';

const Letter = React.createClass({
    render() {
	return (
		// lots of HTML stuff here...
	)
    }
});

var CapitalAButton = React.createClass({
    getInitialState: function(){
	return { showCapitalA: false  };
    },

    showCapitalA: function(){
	this.setState({
	    showCapitalA: true
	});
    },
    
    render: function() {
	return (
	    <div id="capital-button" onClick={this.showCapitalA}>
	    A
	    { this.state.showCapitalA? ReactDOM.render(<Letter />, document.querySelector('#letter')) : null }	    
	    </div>
	)
    }
});

var ButtonChoices = React.createClass({
    render: function() {
	return (
	    <CapitalAButton />
	)
    }
});

ReactDOM.render(
    <div id="a">
    <ButtonChoices />
    </div>,
    document.querySelector('#button-group')
);