jQuery: Get HTML as well as input values

Viewed 19502

I'm trying to have a variable store the HTML in a div tag, but simply using var a = $('div').html() doesn't store the values of the input tags that lie within the div.

So, my question is, how should I go about saving the HTML and the selected options and values of input tags to a variable using jQuery?

Here is some example code:

HTML:

<div>
  <p>Some Text</p>
  <select name="word">
    <option value="1">Placeholder 1</option>
    <option value="2">Placeholder 2</option>
  </select>
  <input type="text" />
</div>

Javascript:

/* "a" should also have the user values, such that when I use $('body').append(a), 
it has the same user input as the div. */

var a = $('div').html(); 

Thanks in advance.

3 Answers

If the document having Ajax content, the best solution would be:

$(document).on("keyup change", "input", function () {
    $(this).attr("value", $(this).val());
});

You must use both change and keyup event.

Related