Issues with hiding <tr> elements in sharepoint form using jquery

Question

I'm running into issue trying to hide elements in my sharepoint NewForm.

I've added the jquery script to my NewForm

<script src="/SiteScripts/jquery-ui-1.8.24.min.js"></script>

I have two types of elements

<tr class="EventRow">

<tr class="ActivityRow">

I'm trying to hide and show this specific rows when a radiobutton is checked.

I've tried $('.EventRow').hide() and recived the following error from IE and FireFox

IE

Object doesn't support property or method 'hide'

FF

TypeError: $(...).hide is not a function

How can I hide a element on a sharepoint form?

Answer 1

.hide is part of the jQuery framework. Loading jQueryUI won't give you that function.

//Load jQuery first
<script src="/SiteScripts/jquery.js"></script>
//Then jQueryUI
<script src="/SiteScripts/jquery-ui-1.8.24.min.js"></script>

Answer 2

I am not sure why it didn't worked using hide. One problem might be the script is getting executed prior the table gets loaded.

Here is another way to do the same

$('.EventRow').css("display", "none");