-3

For some reason I can't get this function to work..I've included the code and error from Chrome.

Is it the :: that's causing a problem? It's driving me nuts. Variable 101 here hehe.

EDIT: I'm trying to call a pseudo-element, which cannot be styled via .css().

var grabColor = $('.sb-custom-color').val();
var placeholder = 'form .entry-form-wrap input::-webkit-input-placeholder';

$(placeholder).css("color", grabColor);

Uncaught Error: Syntax error, unrecognized expression: form .entry-form-wrap input::-webkit-input-placeholder

Mike Barwick
  • 6,288
  • 6
  • 51
  • 76
  • 3
    change the :: and find out. Problem solving 101. :) – VVV Mar 09 '13 at 02:43
  • `$.css` changes the `style` property. you can't change the `style` of a pseudo-element. you'll have to modify an [actual DOM stylesheet](https://developer.mozilla.org/en-US/docs/DOM/CSSStyleSheet) programmatically. – Eevee Mar 09 '13 at 02:45
  • 1
    Which element are you trying to select using `placeholder`? – ShuklaSannidhya Mar 09 '13 at 02:47
  • @Eevee Thanks man. I was going to do that initially...but was trying to avoid static css in my source. – Mike Barwick Mar 09 '13 at 02:49
  • 1
    @MikeBarwick didn't mean to be rude. You said "Is it the :: that's causing a problem?". What exactely are you trying to get with input::-webkit-input-placeholder? BTW the downvote wasn't mine! – VVV Mar 09 '13 at 02:50
  • @SandyLee an input field... – Mike Barwick Mar 09 '13 at 02:51
  • 1
    Can you simply give a class to that input field and write ... input.className ... or even an attribute and select it by doing input[rel="-webkit-input-placeholder"]? – VVV Mar 09 '13 at 02:53
  • you don't need static CSS in your source for this; there are DOM methods for creating and manipulating stylesheets entirely from JS. (or you could just populate one with `$.text`, i suppose.) – Eevee Mar 09 '13 at 02:56
  • @vyx.ca No worries at all. I'm trying to dynamically change the color of the placeholder text on some form inputs. Ah - I could care less about the downvote. I'm not here to earn points and flex my muscles. Just here to learn. :) – Mike Barwick Mar 09 '13 at 03:00
  • 1
    Why don't you assign it a `class` or an `id`? – ShuklaSannidhya Mar 09 '13 at 03:01
  • User dynamically changes the color for a customizable form in our application. Can't be a class and @vyx.ca that won't work customizing placeholder text. It needs to be called directly. As per my code. That's also why many DOM methods probably don't work well either. Guess I'm stuck using style tag within source...agh. – Mike Barwick Mar 09 '13 at 03:08
  • Could you proved us with a fiddle. I'm sure there's a way! There's always a way!! :) – VVV Mar 09 '13 at 03:10
  • I think this has several decent options I"m going to explore! Thanks ya'll for your help! http://stackoverflow.com/questions/351633/how-do-i-load-css-rules-dynamically-in-webkit-safari-chrome – Mike Barwick Mar 09 '13 at 03:19

1 Answers1

2

You can't select pseudo elements with jQuery or in JavaScript for that matter. Instead create a style tag or modify a style element.

Musa
  • 96,336
  • 17
  • 118
  • 137