Filling in a form with jQuery

Question

I'm trying to fill a form with some details such as name and email with jQuery and am having trouble getting it to work.

<form action="/shipping" method="post" novalidate="">
  <div class="linked input_group">
    <p class="input text span_half">
      <label for="buyer_first_name">First name</label>
      <input type="text" name="buyer_first_name" id="buyer_first_name" value="">
    </p>
    <p class="input text span_half">
      <label for="buyer_last_name">Last name</label>
      <input type="text" name="buyer_last_name" id="buyer_last_name" value="">
    </p>
  </div>
  <div class="input_group">
    <p class="input text">
      <label for="buyer_email">Email address</label>
      <input type="email" name="buyer_email" id="buyer_email" value="">
    </p>
  </div>
</form>

I thought I could use the below, and have tried several variations, but I still can't get it to work.

$("#buyer_first_name").val('dave smith'); 

Any help? Thanks

Answer 1

My guess is that you run the jQuery code before the DOM is ready for manipulation: https://jsfiddle.net/fyb4xkvj/1/

$(document).ready(function() {
    $("#buyer_first_name").val('dave smith'); 
});

Answer 2

You code works as long as jquery is actually loaded.

<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>

https://jsfiddle.net/u65k9mzp/