title: Add Border Between Bootstrap Columns from Twitter Loop
body: <p>Ok, I have an interesting puzzle to solve.</p>
  
  <p>I have a WordPress site that is outputting a Twitter feed using <a href="https://wordpress.org/plugins/oauth-twitter-feed-for-developers/" rel="nofollow noreferrer">oAuth Twitter Feed for Developers Plugin</a></p>
  
  <p>I needed that plugin because I need to display the 3 most recents tweets from a user horizontally. Here's the code that goes with the plugin:</p>
  
  <pre><code>&lt;div class="container" id="b2btwitter"&gt;
    &lt;?php
      $tweets = getTweets('anthonytravel', 3, array('exclude_replies' =&gt; true, 'include_rts' =&gt; false));
      foreach($tweets as $tweet){
          if($tweet['text']){
            echo '&lt;div id="twitterCol" class="col-xs-6 col-sm-4"&gt;';
              $the_tweet = $tweet['text'];
              foreach($tweet['entities']['user_mentions'] as $key =&gt; $user_mention){
                  $the_tweet = preg_replace(
                      '/@'.$user_mention['screen_name'].'/i',
                      '&lt;a href="http://www.twitter.com/'.$user_mention['screen_name'].'" target="_blank"&gt;@'.$user_mention['screen_name'].'&lt;/a&gt;',
                      $the_tweet);
              }
              foreach($tweet['entities']['hashtags'] as $key =&gt; $hashtag){
                  $the_tweet = preg_replace(
                      '/#'.$hashtag['text'].'/i',
                      '&lt;a href="https://twitter.com/search?q=%23'.$hashtag['text'].'&amp;src=hash" target="_blank"&gt;#'.$hashtag['text'].'&lt;/a&gt;',
                      $the_tweet);
              }
              foreach($tweet['entities']['urls'] as $key =&gt; $link){
                  $the_tweet = preg_replace(
                      '`'.$link['url'].'`',
                      '&lt;a href="'.$link['url'].'" target="_blank"&gt;'.$link['url'].'&lt;/a&gt;',
                      $the_tweet);
              }
              echo '&lt;h1&gt;Anthony Travel&lt;/h1&gt;&lt;h2&gt;&lt;a href="https://www.twitter.com/AnthonyTravel"&gt;@anthonytravel&lt;/a&gt;&lt;/h2&gt;';
              echo '&lt;p&gt;'.$the_tweet.'&lt;/p&gt;';
              echo '&lt;span&gt; -- '.humanTiming(strtotime($tweet['created_at'])) . ' ago&lt;/span&gt;';
              echo '&lt;/div&gt;';
          } else {
              echo '
              &lt;br /&gt;&lt;br /&gt;
              &lt;a href="http://twitter.com/anthonytravel" target="_blank"&gt;Click here to read anthonytravel\'S Twitter feed&lt;/a&gt;';
          }
      }
      function humanTiming ($time)
      {
          $time = time() - $time; // to get the time since that moment
          $tokens = array (
              31536000 =&gt; 'year',
              2592000 =&gt; 'month',
              604800 =&gt; 'week',
              86400 =&gt; 'day',
              3600 =&gt; 'hour',
              60 =&gt; 'minute',
              1 =&gt; 'second'
          );
          foreach ($tokens as $unit =&gt; $text) {
              if ($time &lt; $unit) continue;
              $numberOfUnits = floor($time / $unit);
              return $numberOfUnits.' '.$text.(($numberOfUnits&gt;1)?'s':'');
          }
      }
    ?&gt;
  </code></pre>
  
  <p>
  Everything works great with this. But what I need is a divider between the tweets. So two dividers. Something like this:</p>
  
  <pre><code>           |           |            
   Tweet 1   |  Tweet 2  |   Tweet 3 
             |           |           
             |           |           
  </code></pre>
  
  <p>As you can see, I can't just add a border to the right side of the <code>div</code> because then the last column would have the border. I need to add CSS to one or two of the columns and not the other(s).</p>
  
  <p>Is there a way to do that in JavaScript or something?</p>
  
  <p>My other thought would be to add the twitter feed three separate times, but do the latest tweet minus 1 or something to that effect. I just don't know if that's possible/how to do that with the Twitter API.</p>