I've been experimenting with creating a Firefox Extension, but I'm struggling to get the button in the popup to work as intended. The desired functionality is for the red border to change to green when the button is clicked, but I can't seem to locate the mistake in my code.
Here's a snippet from my manifest.json file:
{
"manifest_version": 2,
"name": "Testing",
"version": "1.0",
"description": "Testing",
"icons": {
"48": "icon.jpg"
},
"content_scripts": [
{
"matches": ["*://*.allee-abi20.de/*"],
"js": ["ust.js"]
}
],
"permissions": [
"activeTab",
"contextMenus"
],
"browser_action": {
"default_icon": "icon.jpg",
"default_title": "Hello",
"default_popup": "view.html"
}
}
Here's the code snippet from view.html:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<link rel="stylesheet" href="style.css" type="text/css"/>
</head>
<body>
<input type="text" id="Kat"></input>
<input type="text" id="Ty"></input>
<button id="but">Click</button>
<script type="text/javascript" src="./popup.js"></script>
</body>
</html>
And here's the snippet from popup.js:
document.body.style.border = "5px solid red";
var myLink = document.getElementById("but");
myLink.onclick = function(){
document.body.style.border = "20px solid green";
}