title: Bulb example with on off button in HTML
body: <p>I got a code which is used for bulb on and off by touching the image. But</p>
  <p>How to modify the code with two buttons On and Off. ?  Pls help</p>
  <h1>Edit</h1>
  <p>Here is the code</p>
  <pre><code>&lt;!DOCTYPE html&gt;
   &lt;html&gt;
    &lt;body&gt;
     &lt;h1&gt;JavaScript Can Change Images&lt;/h1&gt;
     &lt;img id=&quot;myImage&quot; onclick=&quot;changeImage()&quot; src=&quot;pic_bulboff.gif&quot; width=&quot;100&quot; height=&quot;180&quot;&gt;
     &lt;p&gt;Click the light bulb to turn on/off the light.&lt;/p&gt; 
    &lt;script&gt;
     function changeImage() { 
        var image = document.getElementById('myImage');
        if (image.src.match(&quot;bulbon&quot;)) {
           image.src = &quot;pic_bulboff.gif&quot;; 
        } 
       else { 
          image.src = &quot;pic_bulbon.gif&quot;; } 
        } 
   &lt;/script&gt; 
   &lt;/body&gt; 
  &lt;/html&gt;
  </code></pre>