Change cursor to a pointer finger when rolling over text

[eswoboda]

On my website I have some hide/show java script (below). It is used commonly in FAQs where you see a list of questions and when rolling over the question it changes color and clicking on it opens text. I would like the cursor to change to a "finger pointer" ( the usual shape of when something is linked) when rolling over the text. Does anyone know how to do that? What should be added to the coding below? The words MY TEXT represent the various text I put in specific to my site. Thank you! (I'm extremely new to all of this )

 

<a onclick="javascript:ShowHide('item')"> MY TEXT </a>

<div class="mid" id="item" style="display: none;"><p> MY TEXT </p></div> <br>

 

<script type="text/javascript">// <![CDATA[

function ShowHide(divId)

{

if(document.getElementById(divId).style.display == 'none')

{

document.getElementById(divId).style.display='block';

}

else

{

document.getElementById(divId).style.display = 'none';

}

}

// ]]></script>

 

[justsomeguy]

CSS has a "cursor" property, set it to "pointer".http://www.w3schools.com/cssref/pr_class_cursor.asp