I am trying to put together a page and my js experience is very limited. I think I have overstepped myself! This is probably a very simplistic problem for an expert
The page is for drill in learning some Egyptian hieroglyphs. There are 106 characters formatted in a table per the examples that follow (the href Onclick works!):
[SIZE=”2″]<td align=”center” valign=”middle”><!– F40 –><a href=”” OnClick=”javascript:MyFunction();return false;”><span class=”p1″>󳪤</span></a></td>
<td align=”center” valign=”middle”><!– U23 –><a href=”” OnClick=”javascript:MyFunction();return false;”><span class=”p1″>󴞇</span></a></td>
I have definitions for each character formatted as follows:
[SIZE=”2″]<div id=”Definition_1″><font size=”1″> MdC</font> <span class=”mdc”>Aw</span> <font size=”1″>Transliteration</font> <span class=”trans”>Aw</span> <font size=”1″>Gardiner code</font> <span class=”gard”> F40</div></span><br>
<div id=”Definition_2″><font size=”1″> MdC</font> <span class=”mdc”>Ab, mr </span> <font size=”1″>Transliteration</font> <span class=”trans”>Ab, mr </span> <font size=”1″>Gardiner code</font> <span class=”gard”> U23</div></span><br>
My goal is to click the character and have the translation put into a div / box called <div id=”AnswerBox”></div>.
I have worked on the function below:
<script language=”javascript”>
function MyFunction()
{
document.getElementById(“????”).innerHTML=”????”;
}
</script>
Three questions:
How do I set up a variable for the definitions?
How do I set it up in my function?
How do I target my answer div with the definition?
I think it is all possible but I just don’t have the experience. I will be profoundly grateful to anyone who can point me in the right direction.