Trouble Executing Scripts from background.js and Establishing Communication with popup.js

Question

I'm encountering difficulties in executing three scripts from my background.js onto the currently active webpage. Additionally, I'm struggling to establish seamless communication between popup and background.

Here's my current setup:

//manifest.json
{
  "manifest_version": 2,
  "name": "My Extension",
  "version": "1.0",
  "description": "Description of my extension",
  "permissions": [
    "activeTab"
  ],
  "browser_action": {
    "default_popup": "index.html",
    "default_icon": {
      "64": "icon.png"
    }
  },
  "icons": {
    "64": "icon.png"
  },
  "background": {
    "scripts": ["background.js"],
    "persistent": false
  },
  "content_scripts": [],
  "web_accessible_resources": []
}

//index.html
<div class="buttons">
  <button class="script-1"></button>
  <button class="script-2"></button>
  <button class="script-3"></button>
</div>

Despite my efforts, I've been unable to successfully execute scripts from background.js, and I suspect that the issue lies in how I'm handling communication between the popup and background scripts. My goal is to achieve a smooth way to communicate and efficiently execute these scripts on the active webpage using background.js.

Any insights or guidance on the correct methodology to establish this communication and effectively execute scripts would be highly appreciated. Below are the relevant files:

index.html
manifest.json
popup.js
background.js

Thank you in advance for your valuable assistance!