title: Changing a list item dynamically in React
body: <p>This is a bit of a mess, but I've been trying - literally - all day so I am a little bit frazzled.</p>
  
  <p>I'm trying to do something that would take me 20 seconds in JQuery, but in React 
   ¯_(ツ)_/¯</p>
  
  <p>Essentially, in my application, tags have an importance associated to them (1-9). Great stuff.</p>
  
  <p>I have a list group that returns my tags in importance order:</p>
  
  <pre><code>const TagScreen = ({
      tags
    }) =&gt;
  {
  
   return(
     &lt;ListGroup&gt;
      { tags.sort(function(a,b) {return a.importance &lt; b.importance}).map((tag) =&gt;
        ( &lt;span key={tag.id}&gt;
            &lt;ListGroupItem className='taglist' bsStyle="success"&gt;&lt;p&gt;{tag.name}&lt;/p&gt;
                &lt;ListItem 
                  active={tag.importance} /&gt;
            &lt;/ListGroupItem&gt;
          &lt;/span&gt;
        )
      )}
     &lt;/ListGroup&gt;
   )
  
  }
  </code></pre>
  
  <p>The ListItem is a (very) poorly named component (so much refactoring to come when I've got this working) but it's essentially an importance selector. It looks like this:</p>
  
  <pre><code>const ListItem = ({index, active}) =&gt;
    { 
      var rows = [];
      for (var i = 1; i &lt; 10; i++) {
      var style = '';
      if (active === i) { style = "active" }
        rows.push(&lt;li className={style}&gt;&lt;a href='#'&gt;{i}&lt;/a&gt;&lt;/li&gt;)
      }
  
    return( 
  
        &lt;ul className="pagination pull-right pagination-sm"&gt; 
          { rows.map((row) =&gt; row)}
        &lt;/ul&gt; 
  
      )
    }
  </code></pre>
  
  <p>Again, I'm sure this is terrible, I am a React Newbie. Essentially, all I want is for the 'active' style (which starts at the current importance of the tag) on the pagination element to change to the one clicked. I've tried so, so much to do this. I'll deal with the actual pinging of the server and changing the importance of the tag later, once I've got this damn style to change onClick.</p>
  
  <p>Thanks for any help.</p>