0

The goal is to amend all the td elements of class mytable to have css property visibility:hidden. the statement $('.mytable td').css('visibility', 'hidden'); seems to have no effect, why?

$(document).ready(function () {
	$('.mytable td').css('visibility', 'hidden');
});
.mytable td {
    border:1px solid;
    visibility:inline;
}
<table class="mytable">
    <tr>
        <td>a</td>
        <td>b</td>
    </tr>
</table>

1
  • It works if you include jQuery... Commented Oct 6, 2015 at 9:27

5 Answers 5

2

Your code does work, but you forgot including jQuery on the page.

$(document).ready(function () {
	$('.mytable td').css('visibility', 'hidden');
});
.mytable td {
    border:1px solid;
    visibility:inline;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="mytable">
    <tr>
        <td>a</td>
        <td>b</td>
    </tr>
</table>


Note that there is also a hide() method which sets display:none your elements.

$('.mytable td').hide();
Sign up to request clarification or add additional context in comments.

2 Comments

hide() is equivalent to .css( "display", "none" )
@PranavCBalan Yes, I just thought it may help the user. Edited my answer.
0

Nothing wrong in your code, you are missing jQuery library in your code. So add <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> for including jQuery library `

$(document).ready(function() {
  $('.mytable td').css('visibility', 'hidden');
});
.mytable td {
  border: 1px solid;
  visibility: inline;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<table class="mytable">
  <tr>
    <td>a</td>
    <td>b</td>
  </tr>
</table>

Comments

0

Try $('.mytable td').css('display', 'none');

1 Comment

That's different bahaviour and doesn't explain OP issue anyway
0

You have missed to include the jQuery library:

$(document).ready(function () {
	$('.mytable td').css('visibility', 'hidden');
});
.mytable td {
    border:1px solid;
    visibility:inline;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="mytable">
    <tr>
        <td>a</td>
        <td>b</td>
    </tr>
</table>

Comments

0

Do this code.

$(document).ready(function () {
     $('.mytable td').css('display', 'none');
});

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.