Javascript Сменить картинку на ходу

Question

Обновление вопроса:
@Mouser, спасибо за этот ответ. хотя я уверен, что код в порядке, на самом деле он ничего не делает. Я считаю, что это потому, что я запускаю скрипт сразу после элементов в разделе тела. Итак, список создается, а затем выполняется код и изменяется источник listimgx, но как я могу заставить его фактически отображать именованный src? В текущем состоянии страницы загружаются, текстовые элементы меняются, а картинки - нет. Я попытался добавить класс в ul и добавить обновление списка в конце моего скрипта, но это не сработало.

Оригинальный вопрос:
Хорошо, следующий код должен проверять значение 2-мерного массива, и если он содержит строку "fi", то он должен изменить i.th listimg.source на write.png.
Другими словами, текущий источник img установлен в "mcicon.jpg". скажем, urlArray[4][1] содержит "fi"; теперь я хочу, чтобы listimg4.src был "write.png". Я пытаюсь использовать цикл for для этого, но пока это не сработало. Я попробовал оба варианта без успеха:
imgname.concat (я).src = "write.png"
currentname.src = "write.png"

//some items in my list:
<li>
<a href="#" onclick="datasent(1);"><img src="mcicon.png" id="listimg0" alt="Gummy Bears" /><span class="ui-li-count">12</span>
<h2 id="testname0"> Test Name 0</h2>
<p id="testexp0">Test Explanation 0</p>
</a>
</li>

<li>
<a href="#dog" onclick="datasent(2);"><img src="mcicon.png" id="listimg1" alt "Min Pin" />
<h1 id="testname1">Test Name 1</h1>
<p id="testexp1">Test Explanation 1</p>
</a> 
</li>
<li>
<a href="#gummies" onclick="datasent(3);"><img src="mcicon.png" id="listimg2" alt="Gummy Bears" />
<h1 id="testname2"> Test Name 2 </h1>
<p id="testexp2">Test Explanation 2</p>
</a>
</li>

//and my javascript code:
<script>
var urlArray = [[1, "mc", "To Be Present", "Choose the correct answer.", 10, 0, 0],[2, "fi", "To Be Present", "Fill in the blanks using To Be Present.", 10, 0, 0]]

//those work:
document.getElementById("testname1").innerHTML = urlArray[1][2];
document.getElementById("testexp1").innerHTML = urlArray[1][3];

//this one does not work! the icon doesn't change!

for (var i=0; i<urlArray.length; i++) {
var imgname = "listimg";
if (urlArray[i][1]==="fi"){
  var currentname = imgname.concat(i);
  if(document.getElementById(currentname) ) //check if element exists
  {
     document.getElementById(currentname).src= "write.png";
     //for debugging; delete from production code.
     console.log(document.getElementById(currentname).src); //should write "write.png" to console.
  }
}
}

Answer 1

Этот код не будет работать. Вы запрашиваете свойство src на string, Это не элемент изображения. document.getElementById("testname1") может быть. Так что установите src этого элемента в currentname,

urlArray = [[0, "si"], [1, "wi"], [2, "fi"]];

for (var i=0; i<urlArray.length; i++) {
    var imgname = "listimg";
    if (urlArray[i][1]==="fi"){
      var currentname = imgname.concat(i);
      if(document.getElementById(currentname) ) //check if element exists
      {
         document.getElementById(currentname).src= "write.png";
         //for debugging; delete from production code.
         console.log(document.getElementById(currentname).src); //should write "write.png" to console.
      }
    }
}

<img src="" id="listimg2" />