title: (object Object) being returned as output of onclick function in JQuery when using EJS
body: <p>So I have a JQuery function that on click of the current input element will change the value of the button. However, I need to be able to get the value of the objects in the li element, denoted by <code>&lt;%= chats[i].msg %&gt;</code>, so I can update my database with the respective data. However on a console.log of the object it keeps returning [object Object]. Is there any way for me to get the data? I'm new to JQuery and EJS so please point me to any duplicates.</p>
  
  <p>JQuery Code </p>
  
  <pre><code>$(document).ready(function(){
  
    $('form').on('submit', function(){ // hit submit
  
        var item = $('form input');
        var chat = {msg: item.val(), likes: ''}; //intially the post will have 0 likes
  
        $.ajax({
          type: 'POST',
          url: '/',
          data: chat,
          success: function(data){
            //do something with the data via front-end framework, so we can update in reall time
            console.log(chat);
            console.log('success! yes'); 
            location.reload();
          }
        });
        return false;
  
    });
    $('.likebutton').on('click', function(){ // hit like
      console.log("like clicked?"); // works
      // i need to find a way to connect this with code and make it update???
  
      var curr = $('.display').val();
      var item = $(this).val('Liked'); // selects approatiate like button
      console.log("item: " + item); // return [object Object]?????  
      $.ajax({ //do something with the data via front-end framework, so we can update in reall time
        type: 'GET',
        url: '/',
        success: function(err){
          // here we will get the data, find it in the data base and update it. Changes will occur 
          // via a reload, either manually or when they create a post, for now. Later we can update 
          // the thing in real time.
  
          // on click we must also change the color of the thing too to show that it was liked
          console.log('success!'); 
        }
      });
        return false;
  
      });
  
  });
  
  </code></pre>
  
  <p>EJS code</p>
  
  <pre><code>
  &lt;!DOCTYPE html&gt;
  &lt;html&gt;
      &lt;head&gt;
      &lt;/head&gt;
      &lt;script
      src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"&gt;&lt;/script&gt;
      &lt;script src="/assets/chat.js"&gt;&lt;/script&gt;    
      &lt;body&gt;
          &lt;h1&gt; Ut whispers&lt;/h1&gt;
          &lt;form action="/" method="POST"&gt;
              &lt;input type="text" placeholder = "say something" name="msg"&gt; &lt;input type="submit" value="Submit"&gt; &lt;br&gt;
          &lt;/form&gt;
          &lt;ul&gt;
              &lt;% for(var i = 0; i &lt; chats.length; i++) { %&gt;
              &lt;li class = "display"&gt;&lt;%= chats[i].msg %&gt; &lt;input type="button" id = "changeit" class = "likebutton" value = "Like: (&lt;%=chats[i].likes%&gt;)" &gt;
                  &lt;ul&gt;
                      &lt;li&gt;replies will go here&lt;/li&gt;
                  &lt;/ul&gt;
              &lt;/li&gt;
              &lt;% } %&gt;
          &lt;/ul&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  
  </code></pre>