How to Use JavaScript to Change the Meta-Tags of the Page

Javascript To Change Metadata / Metatags Dynamically

You wanna do something like this in the code for jQuery

$(document).ready(function(){
    $('title').text("Your new title tag here");
    $('meta[name=description]').attr('content', 'new Meta Description here');
});

Change meta tag content dynamically through javascript

This works for me.
The issue could have been that you tried a first code which did not work and you commented the code with HTML comments instead of Javascript comments: // [...] or /** [...] */.

<!DOCTYPE html><html>
<head>  <meta HTTP-EQUIV="refresh" name="description" id="mymetatag" content="5;URL=http://localhost:6985/ChartJSDemo/Is_Mainpage.html">  <meta charset="ISO-8859-1">
  <title>Processing Details</title>  <link rel="stylesheet" type="text/css" href="css/MF_job_failTable.css"></head>
<body>
  <button onclick="myFunction()">Click me</button>
  <script>    function myFunction() {      document.getElementById("mymetatag").setAttribute("content", "5;URL=http://google.co.in");    }  </script></body></html>

Change meta tag in header dynamically?

You can change meta tag using this

$('button').on('click', function() {    $('meta[name=description]').remove();    $('head').append( '<meta name="description" content="this is new">' );    console.log($('meta[name=description]').attr('content'));});

<head>    <meta name="description"content="this is old">    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script></head><button>Change Meta</button>

Dynamically change the meta/title tag, depending on the page with js

You can directly get the php variable into meta tag as shown below.

<?
    include('head.php'); //beginning of the <head> tag
?>
    <title>Some title</title>
    <meta name="description" content="<?php echo $DESCRIPTION;?>">>
    <meta name="keywords" content="<?php echo $KEYWORDS;?>">>
<?
    include('header.php'); - //end of </head> tag
    include('index_content.php');
    include('footer.php');
    include('form.php');
    include('js.php');
?>

UPDATE

If you use jquery, this might work

$("meta[name='description']").attr("content","<?php echo $DESCRIPTION;?>");

How to dynamically update Meta tags (OG) using JavaScript

Finally, cracked the code. Here it is for any future wanderers: https://github.com/idaljot/meta-tag-auto-update/blob/master/meta-tag.htm

How to change multiple meta tag descriptions with a single variable (vanilla JS)?

You can use the querySelector with meta[key=value] and then set Attribute with setAttribute(key,value).

document.querySelector("meta[name='description'" ).setAttribute("content", "some new meta description");

document.querySelector("meta[itemprop='description'" ).setAttribute("content", "some new meta description");

document.querySelector("meta[property='description'" ).setAttribute("content", "some new meta description");

Change meta tags according to current route in Aurelia app

In aurelia you can change page title by special command on activate event:

activate(params, routeConfig){
  routeConfig.navModel.setTitle(this.someData);
}

If you want to change meta tags then you can use jquery

import $ from 'jquery';

export class SampleModel{

  attached(){
    $('meta[name=description]').remove();
    $('head').append( '<meta name="description" content="this is new">' );
  }

}

More solutions in javascript: Is it possible to use javascript to change the meta-tags of the page?