How to use JSON.parse in react.js

I want to pass the JSON data in "about" as html:

   "bacon": {
        "image": "bacon.jpg",
        "about":"<div>Bacon ipsum dolor amet frankfurter prosciutto kevin pork loin filet mignon pastrami bacon biltong. <strong>Cupim spare ribs alcatra kevin sausage beef ribs shankle meatloaf rump beef.<\/strong> Meatball tri-tip ground round bresaola. Pastrami boudin corned beef beef kielbasa</div>",
        "title":"About Me:"
    }

I am using React.js and here is my code:

var Bacon = React.createClass({
    getInitialState: function() {
        return {data: []}
    },
    componentWillMount: function() {
        $.ajax({
            url: 'data/data.json',
            dataType: 'json',
            success: function(data) {
                this.setState({data: data.bacon});
            }.bind(this),
            error: function(xhr, status, error) {
                var err = JSON.parse(xhr.responseText);
                console.log(err.Message);
            }
        });
    },
    render: function() {
        return (
            <p className="bacon">{this.state.data ? JSON.parse(this.state.data.bacon) : " "}</p>
        )
    }
});

This fails with

"Uncaught SyntaxError: Unexpected token u"

If I remove JSON.parse() from the data state, then the data is retrieved but all of the html is output as a string.

I think that maybe JSON.parse is still attempting to execute before the data is set in state, but I am using the ternary to check if data is loaded. So "p" should have one empty space until the data loads.

Does anyone know what I am doing wrong here?