Greensock - animating TweenMax.min.js

HTML

<script src="http://cdnjs.cloudflare.com/ajax/libs/gsap/latest/TweenMax.min.js"></script>
<div style="left: 0px;" id="logo" class="logo">
    <p>Hello World!</p></div>
<button aria-disabled="false" role="button" id="btn"><span>tween</span></button>

CSS

body {
      background-color: #eee;
  }
#logo {
    position: relative;
    width: 150px;
    height: 50px;
    background: red;
    color: #000;   
    font-family: Arial, Helvetica, sans-serif;
    border-bottom: solid #000 10px;
    text-align:center;
   
}

JavaScript

$('#btn').on('click', function () {
    //alert('clicked');
    var logo = document.getElementById("logo");
    TweenLite.to(logo, 2, {x:function() {console.log("moop"); return 242;}, backgroundColor:"blue", borderBottomColor:"red", color:"white"});

});