I need to update the text in a specific element by overriding it with jQuery as I do not have direct access to edit the original text.
While I understand the basics of how this works, I am unsure of the correct method to target and replace the value.
Using an ID like 'demo' makes it easier:
<script>
$(document).ready(function(){
$('#demo').text('The replaced text.');
});
</script>
Now, my question is regarding changing the text ("Credit Card/Debit Card (Affirm)") within the following code snippet to be "affirm". The catch is that I cannot rely on the payment_method name because it is shared with another payment method:
<label>
<input type="radio" name="payment_method" value="affirm">
Credit Card/Debit Card (Affirm)
</label>
Thank you for your help!
Edit 1:
The entire HTML Code
<div id="content" class="col-xs-12 col-sm-12">
<p>Please select your preferred payment method.</p>
<div class="radio">
<label>
<input type="radio" name="payment_method" value="authorizenet" checked="checked">
Credit Card/Debit Card (Authorize.Net) </label>
</div>
<div class="radio">
<label>
<input type="radio" name="payment_method" value="affirm">
Credit Card/Debit Card (Affirm) </label>
</div>
<p><strong>Add comments about your order.</strong></p>
<p>
<textarea name="comment" rows="8" class="form-control"></textarea>
</p>
<div class="cart-module">
<div class="cart-content">
<div class="row">
<div class="col-sm-6">
<div class="form-group">
<h4 for="input-coupon">Coupon Code</h4>
<div class="input-group">
<input type="text" name="coupon" value="" placeholder="Coupon Code" id="input-coupon" class="form-control">
<span class="input-group-btn">
<input type="button" value="Apply" data-code="coupon" data-loading-text="Loading..." class="btn btn-primary">
</span>
</div>
</div>
</div>
<div class="col-sm-6">
<div class="form-group">
<h4 for="input-voucher">Gift Certificate Code</h4>
<div class="input-group">
<input type="text" name="voucher" value="" placeholder="Gift Certificate Code" id="input-voucher" class="form-control">
<span class="input-group-btn">
<input type="button" value="Apply" data-code="voucher" data-loading-text="Loading..." class="btn btn-primary">
</span>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="buttons">
<div class="pull-right">I have read and agree to the <a href="https://hhtruckaccessories.com?route=information%2Finformation%2Fagree&information_id=5" class="agree"><b>Shipping and Returns</b></a>. <input type="checkbox" name="agree" value="1">
<input type="button" value="Continue" id="button-payment-method" data-loading-text="Loading..." class="btn btn-primary">
</div>
</div>
<script src="/js/catalog/checkout/payment_method/bundle.js?v=1.58.1" type="text/javascript"></script> </div>