jQuery addClass example

Change class name on click in jQuery

HTML

<div id="chat-wrapper">
  <div id="private_chat_menu">
     <select id="chat_user_select" name="chat_user_select">
        <option value="">Select Assigned User</option>
        <option value="1">...</option>
        <option value="2">...</option>
     </select>
  </div>
</div>

CSS

body {
  background: #20262E;
  padding: 20px;
  font-family: Helvetica;
}

#private_chat_menu {
  background: green;
  width: 200px;
  height: 50px;
  text-align: center;
  padding-top: 2em;
}

JavaScript

$("*:not(#private_chat_menu > *)", "body").mouseup(function(e)
{
    var chat_user_container = $('#private_chat_menu');
    var chat_container = $('#chat-wrapper');

    if (chat_container.css("visibility") == 'visible' && chat_user_container.is(':visible'))
    {
        chat_user_container.hide();
    }
});