title: JSON stringified string breaks inside the data attribute when has a space separated value
body: <pre><code> var dataObj=  {
        "Cast_Code": "NA",
        "Mat_Code": "xxxx",
        "Pin_Num": "xxxx",
        "MatDetail": [
          {
            "Batch_Number": "Patch PA",
            "Batch_Expiry": "No Expiry",
            "Batch_Quantity": "xxx",
            "Return_Qty": "0.00"
          }
        ]
      }
  </code></pre>
  
  <p>I am trying to assign the above object as an attribute to an element like this:</p>
  
  <pre><code>content +='&lt;div class="save_data" data-savereturn='+JSON.stringify(dataObj)+'&gt;&lt;/div&gt;';
  </code></pre>
  
  <p>But on viewing the source it appears in the HTML like:</p>
  
  <pre><code>&lt;div class="save_return" data-savereturn="{"Cast_Code": "NA",...,
        "MatDetail": [
          {                //Notice the double quote between "Patch PA"
            "Batch_Number": "Patch" pa","batch_expiry": "no expiry","batch_quantity": "xxx","return_qty": "0.00""
          }
        ]
      }"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>I further tried</p>
  
  <pre><code>console.log(JSON.stringify(dataObj));
  </code></pre>
  
  <p>which logs the output correct without being broken by the double quote as in the case of assigning it to the <code>data-savereturn</code>.</p>
  
  <p>This <strong>dataObj</strong> gets created in a <strong>jQuery.each</strong> loop which is then assigned to corresponding HTML elements.</p>
  
  <p>Unable to figure out the breaking of JSON which is truncating &amp; lowercasing of the portion after the space.</p>
  
  <p>It doesn't happens when the word has no space in between i.e </p>
  
  <pre><code>"Batch_Number": "PatchPA",
  </code></pre>
  
  <p><strong>Update:</strong></p>
  
  <p>on
      start quotes double (")</p>
  
  <pre><code>content +='&lt;div class="save_data" data-savereturn="'+JSON.stringify(dataObj)+'"&gt;&lt;/div&gt;';
  
  
      it shows:
  
      &lt;div class="save_return" data-savereturn="{" Cast_Code":"na","Mat_Code":"xyz","Pin_Num":"xyz","batchdetail":[{"batch_number":"patch="" na","batch_expiry":"no="" expiry","batch_quantity":"20","return_qty":"0.00"}]}"=""&gt;&lt;/div&gt;
  
      jQuery('.selector').data('savereturn')
       gives
      {
        "savereturn": "{"
      }
      which gives an error on JSON.parse "Uncaught SyntaxError: Unexpected end of JSON input"
  </code></pre>
  
  <p>changed the start quotes to single (')</p>
  
  <pre><code>     content +="&lt;div class='save_data' data-savereturn='"+JSON.stringify(dataObj)+"'&gt;&lt;/div&gt;";
  
          &lt;div class="save_return" data-savereturn="{"Request_Code":"NA";"Mat_Code":"xx";"In_num":"xx","BatchDetail":[{"Batch_Number":"Batch NA","Batch_Expiry":"No Expiry","Batch_Quantity":"10","Return_Qty":"0.00"}]}"&gt;&lt;/div&gt;
  
  jQuery('sel').data('savereturn') gives:
  {
    "Cast_Code": "NA",
    "Mat_Code": "tttt",
    "Tin_Number": "ppp",
    "PatchDetail": [
      {
        "Batch_Number": "Patch NA",
        "Batch_Expiry": "No Expiry",
        "Batch_Quantity": "10",
        "Return_Qty": "0.00"
      }
    ]
  }
  which also give error on JSON.parse "Uncaught SyntaxError: Unexpected token o in JSON at position 1"
  </code></pre>
  
  <p>2nd one looks correct but still having JSON invalid.</p>
  
  <p>Sorry for the poor formatting.</p>