title: How to store javascript object or JSON in html element usiing html5 data attribute?
body: <p>I have anchor element.I want to store and retrive the object in it like this way.</p>
  
  <pre><code>&lt;a  id ="test" data-val="{key1:val1,key1:val1}"&gt; &lt;/a&gt;
  </code></pre>
  
  <p>If I save in this way,while fetching it </p>
  
  <p><code>$("#test").data('val')</code> it gives me string like </p>
  
  <p><code>"{key1:val1,key1:val1}"</code>.</p>
  
  <p>But I am unable to parse it to <code>json or javascript object</code> again.
  I have tried using <code>$.parseJSON()</code>,<code>JSON.parse()</code>. But it throwing an error.</p>
  
  <p>How we can achive it without <code>localstorage or sessionstorage o cookie</code></p>
  
  <p><strong>EDIT</strong> :</p>
  
  <p>After calling <code>$("#test").data('val')</code> </p>
  
  <p>I am getting string like this</p>
  
  <pre><code>"{'category_slug' : 'featured','tip_slug':'tip-with-all-cats'}"
  </code></pre>
  
  <p>If i have use <code>$.parseJSON()</code>or <code>JSON.parse()</code> it throwing an error </p>
  
  <pre><code>Uncaught SyntaxError: Unexpected token
  </code></pre>