title: JSON - changing the key value pair based on users input
body: <p>I'm trying to get the users input and make it a part of the json I'm building, what I want to achieve is like this.</p>
  
  <p>When the user fills the textbox, I could get that value and alert it? however currently the output that I'm getting is only "[object HTMLInputElement]".</p>
  
  <p>Here's my code and a fiddle: <a href="http://jsfiddle.net/u3a4f/" rel="nofollow">http://jsfiddle.net/u3a4f/</a>
  Any COmment Suggestions is appreciated:</p>
  
  <pre><code>&lt;html&gt;
      &lt;head&gt;
          &lt;meta charset="UTF-8"&gt;
          &lt;title&gt;&lt;/title&gt;
          &lt;script&gt;
              function Run() {
               var x = document.getElementById("fruits");
  
                  var data = {"fruits": x};
                  alert(data.fruits);
              }
          &lt;/script&gt;
      &lt;/head&gt;
      &lt;body&gt;
          &lt;input id="fruits"&gt;
          &lt;button onClick="Run()"&gt;Run&lt;/button&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>