Can't get a conditional statement to work...help please!

Can't get a conditional statement to work...help please!

I'd like to inject the class name "in" into a div if the div contains the text "In" or "Remote", and for everything else have the class name "out" get injected instead. The first part of the if statement seems to be working but the second part, the else part, doesn't seem to work. Here is my code:

  1. (function ($){
  2.   Drupal.behaviors.at_topnav = {
  3.     attach: function(context, settings) {
  4.    
  5.     var i = $('div.user_status:contains("In", "Remote")');
  6.       if ( i ) {
  7.         $('div.user_status').addClass('in')
  8.       }
  9.       else {
  10.         $('div.user_status').addClass('out')
  11.       };

  13.     }
  14.   };
  15. })(jQuery);

HTML:
  1. <div class="wbuser">
  2.   <div class="user_status">In</div>
  3. </div>
  4. <div class="wbuser">
  5.   <div class="user_status">Out</div>
  6. </div>
  7. <div class="wbuser">
  8.   <div class="user_status">Remote</div>
  9. </div>
  10. <div class="wbuser">
  11.   <div class="user_status">OOB</div>
  12. </div>



CSS:
  1. .wbuser .user_status {
      color: #666666;
      float: left;
      position: relative;
      right: 83px;
      text-indent: 25px;
      word-wrap: normal !important;
    }
    .wbuser .in {
      background: #7EA43F;
      -moz-border-radius: 50px;
      -webkit-border-radius: 50px;
      border-radius: 50px;
      height: 15px;
      width: 15px;
    }
    .wbuser .out {
      background: #CC6616;
      -moz-border-radius: 2px;
      -webkit-border-radius: 2px;
      border-radius: 2px;
      height: 15px;
      width: 15px;
    }