title: Gettign error while returning elements in render() function React+redux
body: <p>I want to print list as per the condition like 
  If I have 2 set of track's 
  1 ) featured 
  2) nonFeatured</p>
  
  <p>if featured track is available then i want to append
            </p>
  
  <pre><code>       &lt;li&gt;Featured Track&lt;/li&gt;
  </code></pre>
  
  <p>before feature track list. </p>
  
  <p>and  if nonFeatured tracks are available then 
           </p>
  
  <pre><code>       &lt;li&gt; Other tracks&lt;/li&gt;
  </code></pre>
  
  <p>before the list</p>
  
  <p>So the output will be - 
         </p>
  
  <pre><code>   &lt;ul&gt;
        &lt;li&gt;Featured Track&lt;/li&gt;
       &lt;li&gt;1&lt;/li&gt;
       &lt;li&gt;2&lt;/li&gt;
        &lt;li&gt;Other tracks&lt;/li&gt;
       &lt;li&gt;1&lt;/li&gt;
    &lt;/ul&gt;
  </code></pre>
  
  <p>Below is my code snippet.</p>
  
  <pre><code>  render() {
      // Feature tracks and tracks are sorted track lists from currentTracks array. CurrentTracks contains both types.
  
      let {featureTracks, tracks, currentTracks}  = this.props.currentTracks
      let errorMessage = currentTracks.error
      let races = null
      if(_.isArray(currentTracks.tracks) &amp;&amp; !_.isEmpty(currentTracks.tracks)) {
          races = (
              &lt;ul className="currentRacesDropdownList animated"&gt;
                  //Code to return feature track
                  if(_.isArray(featureTracks) &amp;&amp; !_.isEmpty(featureTracks)) {
                      return (
                          &lt;li className="dropDownHeading ttFont fontRed"&gt;
                              Featured Tracks (5)
                          &lt;/li&gt;
                          { featureTracks.map((track, key) =&gt; &lt;RaceLineItem key={key} track={track} /&gt; )}
                      )
                  }
                  if(_.isArray(tracks) &amp;&amp; !_.isEmpty(tracks)) {
                      //Code to return other track
                      return (
                          &lt;li className="dropDownHeading ttFont fontRed"&gt;
                              All Other Tracks (5)
                          &lt;/li&gt;
                          { tracks.map((track, key) =&gt; &lt;RaceLineItem key={key} track={track} /&gt; )}
                      )
                  }
              &lt;/ul&gt;
          )
      }
  
      return (
          &lt;div&gt;
              {races}
              {errorMessage}
          &lt;/div&gt;
  
  
      )
  }
  </code></pre>
  
  <p>But I am getting error in return statement after if()</p>
  
  <p>Just same question in other way please have a look at below example . </p>
  
  <pre><code>  I have below array , and if track is feature then i want to print it under "Feature" headline , and if track is non feature then i want to print it under "Other" headline.       
   var a = [{
          isFeature:true,
          name: 'abc'
  
       },{
         isFeature:false,
         name: 'xyz'
  
       },{
        isFeature: false,
        name: 'bpl'
   }]
  </code></pre>
  
  <p>And on react I want to render it in below html format - 
         </p>
  
  <pre><code>   &lt;ul&gt;
       &lt;li&gt;Feature&lt;/li&gt; 
       &lt;li&gt;abc&lt;/li&gt; 
       &lt;li&gt;xyz&lt;/li&gt;
       &lt;li&gt;Non Feature&lt;/li&gt; 
       &lt;li&gt;bpl&lt;/li&gt;  
     &lt;/ul&gt;
  </code></pre>