Q:

change text content on mouseover to img alt property

i have some img tag with class name box, and a p tag with class title, i need to change on mouseover and change text content of p tag to alt property of img that clicked, please help me.
<table style="width:100%;padding-top:200px;border-bottom:5px solid black;">
    <tr style="text-align:right;width:100%;font-size:small;text-align:center;">
        <td class="box" style="width:22%;">
            <a href="http://xxxxxx.com">
                <img src="Images/photo_2016-06-21_12-13-45.jpg" alt="link1" class="imgLogo" />
            </a>
        </td> 
        <td  class="box" style="width:22%;">
            <a href="http://xxxxxxxxx.com">
                <img src="Images/photo_2016-06-21_12-13-18.jpg" alt="link2" class="imgLogo" data-tree="oak" onmouseover="reply_click(this);"/>
            </a>
        </td>
        <td class="box" style="width:22%">
            <a href="http://xxxxx.com/pwa">
                <img src="Images/photo_2016-06-21_12-14-00.jpg" alt="link3" class="imgLogo" /> 
            </a> 
        </td>
        <td class="box" style="width:22%">
            <a href="http://xxxx.com">
                <img src="Images/photo_2016-06-21_12-13-51.jpg" alt="link4" class="imgLogo" /> 
            </a> 
        </td>
    </tr>
</table>

and my p tag:
<p style="text-align: center" id="title-links" class="title-links">content here</p>

i want to write it with javascript, i dont want to use jQuery.

A:

I coded solution for this question using by javascript.
Add onmouseover and onmouseout event properties into the img tag. As below:
<img src="Images/photo_2016-06-21_12-13-45.jpg" alt="سیستم مدیریت جلسات" class="imgLogo" onmouseover="changeText(this)" onmouseout="changeTextToDefault()"/>

After this, add the following js functions linked to above mouse events.
This changeText() function going to execute when mouse pointer come over the displayed img tag. After, it changes text content of p tag to the value of alt property on img tag.
function changeText(xTag){ document.getElementById("title-links").innerHTML =xTag.getAttribute("alt");}

Also, changeTextToDefault() function going to execute when mouse pointer leaves over the displayed img tag. And, it changes text content of p tag to the default text.
function changeTextToDefault(){ document.getElementById("title-links").innerHTML = "سیستم مدیریت جلسات";} 

Here is demo

