CODEWITHSUNDEEP
javascripthtml
user9563697
user9563697

Reputation:

Changing content of html if it matches a string

Trying to use an if statement to check if a piece of html equals a string, and if it does replace it. So far the payment method will get changed to Pending payment but the new paragraph element won't be. opaymethod changes dynamically dependent on how a customer has paid for an item.

html

<div class="label">Payment Type:</div>
    <div class="text" id="paymentMethod">[opaymethod]</div>
    <div class="clear"></div>
<div class="element"></div>

js

$(document).ready(function() {
  var doc = document.getElementById('paymentMethod').innerHTML;
  var res = doc.replace("Account customers", "Payment pending");

  document.getElementById("paymentMethod").innerHTML = res;


  if(document.getElementById('paymentMethod').innerHTML === 'Payment pending'){

    document.getElementById('element').append("<p>Payment Options: Bank payment</p>");
     console.log("inserted");
  }
  else
     console.log("not inserted");    
});

Upvotes: 0

Views: 81

Answers (2)

BRO_THOM
BRO_THOM

Reputation: 851

I think this might be what you're looking for:

<div class="label">Payment Type:</div>
<div class="text" id="paymentMethod">Payment pending</div>
<div class="clear"></div>
<div class="element" id="element"></div>

<script>
    document.addEventListener('DOMContentLoaded', function(e){
        var paymentMethodElement = document.getElementById('paymentMethod');
        var elementElement = document.getElementById('element');
        paymentMethodElement.innerHTML = "Account customers";

        if( paymentMethodElement.innerHTML == "Account customers" ){
            alert('Payment method == Account customers!');
            elementElement.innerHTML = "<p>Payment Options: Bank payment</p>";

        } else {
            alert('Something went wrong!');
        }
    });
</script>

Upvotes: 1

martinho
martinho

Reputation: 1016

When you do append, you are looking for the element by ID and if you repair the element has no ID but yes class.

Change

<div class="element" id="element"></div>

Upvotes: 0

Related Questions