Код, который гуляет сам по себе
 

Всем привет!
Вопрос в следующем: скрипт работает, находясь в HTML, но не хочет работать, если его вынести отдельным файлом.
Пробовала и на компе (файлик подключала) и на codepen.

Собсно код:

<table align=center>
  <tr>
    <td> 
	<input id='dis' type = 'image' src='' width = '20' height = '20'   name = 'left' value = '<' onclick = 'left()' />
	  </td>
    <td>
      <script type = 'text/javascript'>
        document.write("<img id = 'rbutton' src = '" + array[0] + "' alt = 'Картинка' width = '500' height = '500' />");
      </script>
    </td>
    <td>
      <input type = 'image' src='' width = '20' height = '20'  name = 'right' value = '>' onclick = 'right()' />
    </td>
  </tr>
</table>

var array = new Array(
    "https://nashzeleniymir.ru/wp-content/uploads/2016/11/%D0%9A%D1%80%D0%BE%D0%BB%D0%B8%D0%BA-%D1%84%D0%BE%D1%82%D0%BE.jpg",            
        "http://profermu.com/wp-content/uploads/2016/09/532425.jpg",        
        "https://i.ytimg.com/vi/uTF2MhXES8o/maxresdefault.jpg",        
        "http://krolist.ru/assets/images/porody-krolikov/russkiy-gornostaevyy/russkij-gornostaevyj-krolik-zaglavnaya-1.gif",
	);
  
  var i = 0;
  function left() {
    var image = document.getElementById("rbutton");
	var dis = document.getElementById("dis");
    i--;
    if (i<0) i = array.length - 1;
	image.src = array[i];
	
  }
  function right() {
    var image = document.getElementById("rbutton");
    i++;
    if (i == array.length) i = 0;
    image.src = array[i];
  }

Что ему нужно? :(

Радиойод, подключайте скрипт перед </body>

там и подключаю...

Ладно бы с подключением еще что-то можно было подумать, а почему не хочет работать даже в онлайн редакторе?

Радиойод,

document.write("<img id = 'rbutton' src = '" + array[0] + "' alt = 'Картинка' width = '500' height = '500' />");

Массива "array" еще нет на странице.

Спасибо!