Title: JavaScript – ReferenceError: Variable is not defined
Last modified: August 21, 2016

---

# JavaScript – ReferenceError: Variable is not defined

 *  [treppenmanfred](https://wordpress.org/support/users/treppenmanfred/)
 * (@treppenmanfred)
 * [12 years, 10 months ago](https://wordpress.org/support/topic/javascript-referenceerror-variable-is-not-defined/)
 * Hi,
 * I’m using [this Theme](http://themeforest.net/item/gentle-responsive-portfolio-wp-theme-retina-ready/3349899).
 * I embedded a video in that top edge-to-edge headerbox. The video is on autostart
   and now I want to add a custom mute button for it. So since I’m far from being
   a JS-genius, I got myself some code from the web and created a plugin, which 
   looks like this:
 *     ```
       <?php
       /*
       Plugin Name: LaLi Mute Button
       Plugin URI:
       Description: Adds a mute button to the main page
       Version: 1.1
       Author: Treppenmanni
       Author URI:
       License:
       */
   
       function lali_mute_button() {
   
       	wp_register_script( 'lali_mutebutton', get_template_directory_uri() . '/js/mutebutton.js">', '', null,''  );
   
       	if ( is_front_page() ) {
       		wp_enqueue_script( 'lali_mutebutton' );
       	}
       }
   
       add_action( 'wp_enqueue_scripts', 'lali_mute_button' );
       ?>
       ```
   
 * The JS-file:
 *     ```
       // Connecting vars
       window.onload = function() {
   
         // Video
         var video = document.getElementById("video");
   
         // Buttons
         var mutebutton = document.getElementById("mute");
   
       }
   
       // Event listener for the mute button
   
       mutebutton.addEventListener("click", function() {
         if (video.muted == false) {
           // Mute the video
           video.muted = true;
   
           // Update the button text
           muteButton.innerHTML = "Unmute";
         } else {
           // Unmute the video
           video.muted = false;
   
           // Update the button text
           mutebutton.innerHTML = "Mute";
         }
       });
       ```
   
 * HTML on the Main site:
 *     ```
       <div id="video-container">
         <!-- Video -->
         <video name "reel" id="video" width="100%">
          <source src="video/Showreel.iphone.mp4"  type="video/mp4; codecs=avc1.42E01E,mp4a.40.2">
         <source src="video/Showreel.webmsd.webm" type="video/webm; codecs=vp8,vorbis">
         <source src="video/Showreel.oggtheora.ogv"  type="video/ogg; codecs=theora,vorbis">
         </video>
         <!-- Video Controls -->
         <div id="video-controls">
           <button type="button" id="mute">Mute</button>
         </div>
       </div>
       ```
   
 * Before that, I stumbled over this register-enqueue-thing and managed to get it
   running (took it’s time). The Plugin loads the script, the getElementByIds give
   back the correct values, but the button does nothing. Firebug gives me an error
   message: **ReferenceError: mutebutton is not defined.** Seems as if the value
   of the variable instantly gets forgotten after defining. Appreciate the help.
 * Treppenmanfred

The topic ‘JavaScript – ReferenceError: Variable is not defined’ is closed to new
replies.

## Tags

 * [getElementById](https://wordpress.org/support/topic-tag/getelementbyid/)
 * [javascript](https://wordpress.org/support/topic-tag/javascript/)
 * [variable](https://wordpress.org/support/topic-tag/variable/)
 * [wp_enqueue](https://wordpress.org/support/topic-tag/wp_enqueue/)

 * In: [Fixing WordPress](https://wordpress.org/support/forum/how-to-and-troubleshooting/)
 * 0 replies
 * 1 participant
 * Last reply from: [treppenmanfred](https://wordpress.org/support/users/treppenmanfred/)
 * Last activity: [12 years, 10 months ago](https://wordpress.org/support/topic/javascript-referenceerror-variable-is-not-defined/)
 * Status: not resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics