0

Here is my attempt that doesn't seem to be working:

$('container').find("[data-slider='" + one + "']").removeClass('hidden');

Here is the full function that is wrapped in a document. ready function

$("#service-icon").on('click', function(){

       var $this = $(this);
       event.preventDefault();

       $this.addClass('ease-transition').toggleClass('active-slider-btn');

       $(".page-wrapper").find("[data-slider='" + one + "']").toggleClass("hidden");


 });

The error that I am getting is:

"Uncaught ReferenceError: one is not defined"

Brian Tompsett - 汤莱恩
  • 5,753
  • 72
  • 57
  • 129
Eduardo Hernandez
  • 469
  • 1
  • 5
  • 11
  • 1
    if container is a class, that should be `$('.container')`. If it is an id, it should be `$('#container')` – iCollect.it Ltd May 08 '14 at 21:46
  • possible duplicate of [jQuery how to find an element based on a data-attribute value?](http://stackoverflow.com/questions/4191386/jquery-how-to-find-an-element-based-on-a-data-attribute-value) – Diodeus - James MacFarlane May 08 '14 at 21:46
  • i took a look at that page before posting my question but that didnt seam to solve my issue, also i change it to $(".page-wrapper") instead of $("container") but dosent seem to solve it, any other suggestions? – Eduardo Hernandez May 08 '14 at 21:55

2 Answers2

0

Things to check:

  1. Is `container` a class or id? If so you'll need to add a `.` or `#` respectively
  2. That the expression in the `.find()` function returns what you're expecting

Can you post a link to a JSFiddle or something?

I have a working example here that is similar to your situation.

HTML

<div class="container">
    <div data-slider="1" class="hidden">1</div>
    <div data-slider="2">2</div>
</div>

<button id="show-1">show slider 1</button>

CSS

.hidden {
    display: none;
}

JavaScript

var one = "1";

$("#show-1").click(function(e){
    $(".container").find("[data-slider='" + one + "']").removeClass("hidden");
});
skeryl
  • 5,225
  • 4
  • 26
  • 28
0

Something like this has to work:

   $('.page-wrapper').find("[data-slider='" + one + "']").removeClass('hidden');

See it working here: http://jsfiddle.net/sNp7x/2/

Maybe the data attribute is set via javascript as well, so you have to be aware of the timing?!

MonkeyVoodoo
  • 538
  • 5
  • 17
  • the error that im getting is "Uncaught ReferenceError: one is not defined ". I have no clue why i am getting that error... – Eduardo Hernandez May 08 '14 at 22:27
  • one has to be defined, as the error says, like so: var one = 'test'; $('.page-wrapper').find("[data-slider='" + one + "']").removeClass('hidden'); – MonkeyVoodoo May 08 '14 at 22:34