Show or Hide html field in tabular datapage with javascript

[DesiLogi]

Hello, 

In a tabular datapage I need to show/hide a field (text64000) that contains html markup and needs to display as html.

I use a div id to isolate each record in the tabular datapage's recordset.  Then I use an 'if' statement to check the values of 2 fields in that record ("field1" and "field2"). If both criteria are met I need to then show the text64000 field ("field3") in html format. If both criteria are NOT met I need it to  show nothing. 

The below code works to check "field1" and "field2" and then show a value in the span, either a typed in text value or a normal text field for that record. The problem is when I try to use the field that contains the html markup ("field3" in this example). It doesn't show anything (is blank). I know the "if" statement is working because I've tested it with other fields, just showing the field in html is the problem. Does anyone know how to tweak this so "field3" will show in html? I tried putting it in a div instead fo a span but that didn't work either.  Any help would be greatly appreciated. 

<div id="mydiv[@field:MyRecordUniqueID]"></div>

<SCRIPT LANGUAGE="JavaScript">

if (("[@field:myfield1]" == "SHOW") && ("[@field:myfield2]" == "active"))
{
document.getElementById("mydiv[@field:MyRecordUniqueID]").innerHTML ="<span>[@field:myfield3!]</span>";
} 

</script>

 

[George43]

1)Make sure HTML editor is turned off. Advanced setting. It can cause creating unproper ASCI symbols.

2) Paste the Code

<div id='mydiv[@field:MyRecordUniqueID]'></div>
 <script type="text/javascript"> 
 document.addEventListener('DataPageReady', function (event) {
    if (("[@field:myfield1]" == "SHOW") && ("[@field:myfield2]" == "active")) { 
        document.querySelector("#mydiv[@field:MyRecordUniqueID]").innerHTML =`<div>[@field:myfield3!]</div>`;
    }
}); 
 </script>

 

[DesiLogi]

Hi George43- that works really well-many thanks!