Develop Reference

Why can't I change my disabled checkbox to enable?

Simple question, so I made sure to try and a lot of solutions before posting this. I have a checkbox and I can't seem to enable it.
With vanilla JS, I've tried removing the attribute, as well as setting the disabled flag to false, and also using jQuery i've tried to use the Prop to no success.
'''html
<input type="checkbox" id="chkAllowToAdminService" name="chkAllowToAdminService" disabled="disabled" data-init-plugin="switchery">
'''
I've tried the following and none of them are working (vanilla JS and jQuery)
'''
document.getElementById('chkAllowToAdminService').disabled = false;
document.getElementById('chkAllowToAdminService').removeAttribute('disabled);
$('#chkAllowToAdminService').prop("disabled", false);
'''
No error messages at all, just nothing seems to be happening.

To remove attribute you may use removeAttribute(name). In your case:
const checkbox = document.querySelector('#chkAllowToAdminService')
checkbox.removeAttribute('disabled')
To set attribute setAttribute(name, value).

// In jQuery
$('#chkAllowToAdminService').attr('disabled','disabled'); // Add disabled
$('#chkAllowToAdminService').removeAttr('disabled',''); // Remove disabled
// OR
$("#chkAllowToAdminService").attr("disabled",true);
$("#chkAllowToAdminService").attr("disabled",false);
// In JavaScript
document.getElementById("chkAllowToAdminService").disabled = true;
document.getElementById("chkAllowToAdminService").disabled = false;

I think you might have two issue :
make sure you have unique id of element 'chkAllowToAdminService' no other element have same id.
in your remove attribute syntex : document.getElementById('chkAllowToAdminService').removeAttribute('disabled);
I can see quote ' is missing at last.

Jquery get element by id, multidimensional array

I'm trying to get the value of a specific html input that is named like:
<input type="hidden" value="." id="grid[0][0]">
where [0][0] could be any value within a foreach loop.
using Jquery:
var currVal = $('#grid['+x+']['+y+']').html();
I'm getting an undefined value. Not sure whether it's a syntax problem. I haven't found a similar example so I'd appreciate any help on this. Thanks!

It actually is a syntax problem. jQuery interprets "#grid[...]" as an HTML element with the ID "grid" and some attribute (or other meta stuff) just like CSS would.
To solve simply escape the [ and ], like this:
$('#grid\\[' + x + '\\]\\[' + y + '\\]').val()
That should do it :)
Edit: As noted by Josh Crozier, the html() method is supposed to be used in normal tags (like div). For input, select or textarea you should use val() -- Docs on that: http://api.jquery.com/val/

You can also do :
var currVal = $('input[id="grid['+x+']['+y+']"]').val();

How to remove/change an input value using javascript

How do I remove the value 'Anonymous' in this input that I have and replace it with a placeholder text 'Your name' using javascript/jquery? I don't have access to the HTML code.
This is what I have so far, but don't really know where to go from there.
document.getElementById('txtYourName').placeholder =' Your Name ';
HTML
<input id="txtYourName" type="text" value="Anonymous" name="txtYourName"></input>

Add this second line here...
A placeholder is only seen when the value happens to be blank. With the code below, you can set the placeholder, as well as erase the default value in your field.
document.getElementById('txtYourName').placeholder =' Your Name ';
document.getElementById('txtYourName').value = "";
Demo: http://jsfiddle.net/723vL/

You can use .val():
$('#txtYourName').val('');
or pure javascript using:
document.getElementById('txtYourName').value = ""
If you want to set new value then just put your value inside "", like:
$('#txtYourName').val('new value');
With jQuery, your final code should look like:
$('#txtYourName').attr('placeholder','Your name');
$('#txtYourName').val('');
Fiddle Demo
With pure JS, you final code should look like:
document.getElementById('txtYourName').placeholder ='Your name';
document.getElementById('txtYourName').value = "";
Fiddle Demo

That should do it, so long as you are running that script either on an onload event, jquery's ready event or at the very bottom of the page, once the DOM has been rendered.
Are you getting an error in your console?

try this
returns value:
$('#txtYourName').attr("value");
sets value
$('#txtYourName').attr("value", "");

use
document.getElementById('txtYourName').value ='some vaue';
if you are using jQuery then you can use
$("#txtYourName").val('some value');

Change text color based on background color?

I've a pretty minimalistic site, so I want to add details to it, like a hidden theme switching. But I don't want to tell the user that the theme can be changed, so I want to hide the text.
I've tried this:
var tausta = $(body).css("background-color");
$('.piiloteksti').css("color",tausta);
But it doesn't do anything. What would be the correct approach?
A fiddle.

if($('.piiloteksti').css("color",tausta); is a wrong statement. Thats a syntax error! There shouldn't be any if here.
Either remove if
$('.piiloteksti').css("color",tausta);
or complete the if statement.
if($('.piiloteksti').css("color",tausta)){
// some other code
}
Also $(body) does not refer to anything. Use either $('body') or $(document.body)

I tried to modify CSS, and it works.
// javascript
var tausta = $('body').css("background-color");
if($('.piiloteksti').css("color") == tausta) {
alert(tausta);
}
// css (test)
body{background-color:red;}
.piiloteksti{color:red;}

The syntax of your the if statement was off a little. Also, body must be made a String literal.
var tausta = $("body").css("background-color");
$('.piiloteksti').css("color", tausta);
Example: http://jsfiddle.net/HbAHS/8/

You can hide the element with CSS
.piiloteksti{display:none;} Fiddle
OR if you think that would interfere with your layout then,
.piiloteksti{visibility:hidden;} Fiddle
Or you can just give transparent color to your piiloteksti elements
.piiloteksti{color:transparent;} Fiddle

Can I remove just the last added class from an element with jQuery

Hey guys, the question pretty much asks itself... however, for more clarity:
I have an element called "chuckPalahniuk" and it has classes named "choke", "fightclub" and "haunted".
How could I get it so when I click on the "chuckPalahniuk" element, it removes "haunted" first, then "fightclub" on the second click and "choke" on the third?
also: be aware that the class names are dynamically added.
Cheers. peeeps!
psy.example:
$('#chuckPalahniuk').click(function() {
$(this).removeLastClassAdded(); //except this function doesn't exist...
});

just save in an array variable c every class you add c.push('yourclass'), then $(this).removeClass(c.pop());
http://www.devguru.com/technologies/ecmascript/quickref/pop.html

This will do it and will deal with leading and trailing whitespace, which a split()-based solution will not:
$('#chuckPalahniuk').click(function() {
this.className = this.className.replace(/(^|\s+)[^\s]+(\s+)?$/, "");
});

Something like:
$('#chuckPalahniuk').click(function() {
$(this).removeClass($(this).attr('class').split(/\s+/).pop());
});