jquery Storing the value of an input box, then recalling it elsewhere

Question

$("form").submit(function () {
    var english = $("input #rawr").val()
    $("h1 em").append(" " + english + " "); //Current submit brings up 'undefined'
    return false;

});

<form>
    <input type="text" name="rawr" id="rawr" />
    <input type="submit" />
</form>

Answer 1

Make the english var:

var english = $("#rawr").val()

Answer 2

You are using the ancestor descendant selector, which isn't what you want.

The selector is looking for an element with an id = rawr, child of an INPUT element .

Remove the space on your selector:

var english = $("input#rawr").val();

or don't use the tag name at all, since you have a unique ID:

var english = $("#rawr").val();

Also don't forget your semicolons!

Answer 3

$("form").submit(function (e) {
    e.stopPropagation();
    var english = $("#rawr", $(this)).val();
    $("h1 em").append(" " + english + " ");
});

<form>
    <input type="text" name="rawr" id="rawr" />
    <input type="submit" />
</form>