Javascript code not running on some webpages [closed]

Am new to javascript. Am trying to display errors in my project webpages in the form of span. So i used javascript code to input a certain text into the span through its id as the following:

//Checking if passwords match
if ($password1 != $password2) {
  //$error1 = "Passwords don't match";
  $error1 = "var error = document.getElementById('error1')
             error.textContent = 'Passwords don't match'
             error.style.color = 'red'";
  //echo $error1;
}else {
  $error1 = null;
}

The id is linked to the following HTML span:

<div id="password2">
   <label>Confirm password:</label>
   <input type="password" name="pw2" required>
   <span id="error1"></span>
</div>

And then i run the javascript code inside HTML in the <script> tag as follows:

<script type="text/javascript">
  <?php echo $error1,$error2; ?>
</script>

That method worked fine in other two webpages same way but in this one it doesn’t. Also the code works fine as i tested the code using PHP echo and it output same string.

Answer

It seems the answer was not use javascript as i did at all, e.g.:

<?php
 
$password1 = "hello";
$password2 = "yello";
 
$dontMatch = $password1 != $password2;
 
?>
<div id="password2">
   <label>Confirm password:</label>
   <input type="password" name="pw2" required>
   <?php if ($dontMatch) echo "<span class='error'>Passwords don't match</span>" . PHP_EOL; ?>
</div>