React Base Fiddle (JSX)

Starting point for creating JSFiddles with React. This uses React with Addons.

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.24/browser.js"></script>
<script src="https://npmcdn.com/react@latest/dist/react-with-addons.js"></script>
<script src="https://npmcdn.com/react-dom@latest/dist/react-dom.js"></script>
<script src="https://facebook.github.io/react/js/jsfiddle-integration-babel.js"></script>

<div id="container">
    <!-- This element's contents will be replaced with your component. -->
</div>

JavaScript 1.7

var data = [
            {
            catId:"parMenu1",
            parentCat:"Genres",
            subcat:[
                {
                    genre:"8Bit",
                    genreId:"1"
                },
                {
                    genre:"Acid House",
                    genreId:"2"
                }
           ]
           },
           {
            catId:"parMenu2",
            parentCat:"sounds",
            subcat:[
                {
                    genre:"blah",
                    genreId:"3"
                },
                {
                    genre:"blah House",
                    genreId:"4"
                }
           ]
           }
    ]

class BrowseByCont extends React.Component {  
    render () {
        let first = this.props.reducerSidenav.find(item => item.catId === "parMenu1");
   			let second = first.subcat.find(subcat => subcat.genre === "8Bit")
        return (
            <div className="browseByContInner">
                <div>{first.catId}</div>
                <div>{second.genre}</div>
            </div>
        )
    }
}



ReactDOM.render(
  <BrowseByCont reducerSidenav={data} />,
  document.getElementById('container')
);