title: Click button, display css class name
body: <p>When I click button (eg.input type="button" class="test"), 
  I want to display style sheet class name.</p>
  
  <p>I already tried like this.</p>
  
  <pre><code>$(this).get(0).style.name
  </code></pre>
  
  <p>But i get only undefined message.
  Please let me know how to get it.</p>
  
  <p>@@Edit</p>
  
  <p>Let me show you my coding.</p>
  
  <pre><code>&lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
  &lt;head&gt;      
  &lt;script type="text/javascript" src="jquery-1.6.4.js"&gt;&lt;/script&gt;  
  &lt;script type="text/javascript" src="jquery-fieldselection.js"&gt;&lt;/script&gt;
  
  &lt;script&gt;
      $(document).ready(function(){
          var CurrentTextBoxID = "";          
  
          // toggles the keyboard to show or hide when link is clicked
          $(":text").focus(function(e) {              
  
              CurrentTextBoxID = this.id;
              var top = ($(window).height() - $('#keyboard').height()) - 25;        
              var left = ($(window).width() - $('#keyboard').width()) / 2;
  
              //alert(CurrentTextBoxID + " focus In");        
              $('#keyboard').css(
                  {               
                      "left": left+"px",
                      "top": top+"px"
                  }
              ).toggle();
  
              $('#keyboard').show();
          });
  
  
          //$(":text").focusout(function() {
          $(":text").focusout(function() {                
  
              alert($(this).attr('class'));
  
              if($(this).attr('class') != "testClass"){
                  $('#keyboard').hide();
              }
  
  
          });
  
          // function thats called when any of the keys on the keyboard are pressed
          $("#keyboard input").bind("click", function(e) {                    
              $('#'+CurrentTextBoxID).replaceSelection($(this).val(), true);      
          }); 
      });
  &lt;/script&gt;
  
  &lt;style type="text/css"&gt;
  #keyboard {
      position: fixed;
      background: #eee;
      display: none;
      border: 1px solid #ccc;
      border-radius:7px;
      width: 700px;
      height: 240px;
      padding: 5px;
      cursor: move;
      box-shadow: -5px -5px 5px 5px #888;
      -moz-border-radius: -5px -5px 5px 5px #888;
      -webkit-border-radius: -5px -5px 5px 5px #888;
  }
  .testClass{
      width: 100px;
  }
  &lt;/style&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;form id="frmOnScreenKeyboard" name="frmOnScreenKeyboard"&gt;  
  
  &lt;table border="0" cellpadding="0" cellspacing="0" &gt;
  &lt;tr&gt;
      &lt;td&gt;
          &lt;input type="text" name="txtTest1" id="txtTest1"/&gt;
      &lt;/td&gt;
  &lt;/tr&gt;
  &lt;tr&gt;
      &lt;td&gt;
          &lt;input type="text" name="txtTest2" id="txtTest2"/&gt;      
      &lt;/td&gt;
  &lt;/tr&gt;
  &lt;tr&gt;
      &lt;td&gt;
          &lt;input type="text" name="txtTest3" id="txtTest3"/&gt;      
      &lt;/td&gt;
  &lt;/tr&gt;
  
  &lt;tr&gt;
      &lt;td&gt;
          &lt;input type="button" name="butButton1" id="butButton1"/&gt;
      &lt;/td&gt;
  &lt;/tr&gt;
  
  &lt;tr&gt;
      &lt;td&gt;
          &lt;input type="password" name="txtpassword1" id="txtpassword1"/&gt;
      &lt;/td&gt;
  &lt;/tr&gt;
  &lt;table&gt;
  
  
  &lt;table height="900px"&gt;
  &lt;/table&gt;
  
  &lt;div id="keyboard"&gt;
      &lt;table border=1 cellpadding=0 cellspacing=0&gt;
          &lt;tr&gt;
              &lt;td&gt;
                  &lt;div id="row2_shift"&gt;
                      &lt;table border=1 cellpadding=0 cellspacing=0&gt;
                      &lt;tr&gt;                                
                          &lt;td&gt;&lt;input name="a" type="button" value="A" class="testClass" /&gt;&lt;/td&gt;
                          &lt;td&gt;&lt;input name="s" type="button" value="S" class="testClass" /&gt;&lt;/td&gt;
                          &lt;td&gt;&lt;input name="d" type="button" value="D" class="testClass" /&gt;&lt;/td&gt;                                                           
                      &lt;/tr&gt;
                      &lt;/table&gt;
                  &lt;/div&gt;
              &lt;/td&gt;
          &lt;/tr&gt;               
      &lt;/table&gt;        
  &lt;/div&gt;
  
  &lt;/form&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>When I use this code,</p>
  
  <pre><code>alert($(this).attr('class'));
  </code></pre>
  
  <p>I still get undefined message.
  Please guide me again, Thank to all.</p>