Witam. Mam divy, który każdy z nich ma identyczną nazwę klasy. Potrzebuję aby w divach w których nic się nie znajduje pojawiała się informacja że jest pusty. Poniżej zamieszczam kod w którym niestety coś zrobiłem nie tak ponieważ jak widać nie działa i brakuje mi już pomysłów. Czekam na pomoc i z góry dziękuję.

https://jsfiddle.net/hcq25nwh/

Podpowiem: $('.page').each. Resztę dopowie Ci manual jQuery

$('.page:empty').html( 'is empty')
I zadnych petli nie trzeba
https://jsfiddle.net/hcq25nwh/1/

[HTML] pobierz, plaintext 
div.page:empty:before{
  content:'pusty';
}
[HTML] pobierz, plaintext 

@trueblue akurat ::before dla treści, która nie jest jedynie element prezentacji wizualnej, tak nie bardzo pasuje. Nie wiem czy jakieś AT nie ma z tym dodatkowo problemów.

Natomiast co do :empty - wciąż zapominam o niektórych nowościach z CSS3...

Dzięki za tak szybki odzew. Jest jeszcze jeden problem, który przedstawiłem w powyższym kodzie. Problem polega na tym że po wyczyszczeniu diva z elementów, które da się usunąć z danego diva nie pojawia się informacja że dany div stał się pusty.

https://jsfiddle.net/hcq25nwh/6/

Po clicku na przycisk jeszcze raz odpal kod sprawdzający divy

Działa. Jednak gdy w jednym z tych divów znajduje się inny div i po kliknięciu delete usuwa się to informacja o pustym divie nie wyświetla się. Czy coś przeoczyłem i coś nie zostało usunięte?

https://jsfiddle.net/hcq25nwh/12/

Hmm... Spacje, znak nowej linii... Ten element musi być całkowicie pusty.

Tak to jest to tylko czy można to jakoś obejść bo nie chciałbym żeby w kodzie było to wszystko pozlepiane ponieważ później nie będę wiedział co i jak?

Po prostu usunąć wszystko, co jest w rodzicu danego przycisku (button.parent.html('')).

Niestety nie działa: https://jsfiddle.net/hcq25nwh/15/

I wgl Cię nie zastanowiło, że linijkę wyżej w kodzie parent jest funkcją i działa?

BTW zamiast $('button') użyj $(this).

Trochę poczytałem i udało mi się zrobić aby sprawdzało mi to z pominięciem spacji dodając !$.trim. Oczywiście sprawdziłem to i działa, ale problem w tym że w moim przykładzie odnoszę się do klasy i narzuca ona dla wszystkich elementów informacje o tym że element jest pusty nawet gdy zawiera coś w sobie. Potrzebuje pomysłu jak zrobić aby pojawiała się informacja tylko dla pustych klas. Niestety nie mogę wykorzystać do tego konkretnych id bo nie wiem ile ich będzie i jakie będą nosić nazwy znam tylko ich klasę. Wiem tylko gdzie leży błąd $('.page').text jednak nie mam pomysłu jak to naprawić ponieważ nie mogę użyć this ponieważ nie jest on zdefiniowany.


https://jsfiddle.net/hcq25nwh/17/

Poczytaj o $.fn.each

Dzięki, pomogło Mógłbyś mi jeszcze napisać dlaczego napis wyświetla się z pominięciem ustawień w css?

https://jsfiddle.net/hcq25nwh/22/

Style css są ustawione dla akapitu, ty natomiast w zmiennej info przechowujesz jedynie tekst, nie znacznik.

Możesz to rozwiązać chociażby poprzez taką instrukcję:

[JAVASCRIPT] pobierz, plaintext 
var info = $('p').html();
info = "<p>"+info+"</p>";
[JAVASCRIPT] pobierz, plaintext 

A jest jakiś sposób żeby połączyć te znaczniki tak aby znajdowały się razem w zmiennej? Bo jeśli nie to wystarczy w sumie dać "<p>"Informacja ktora chce"</p>" bez kombinowania.

Oprócz sposobu z #17 możesz też pozbyć się końcówki
var info = $('p').html();
wtedy w zmiennej masz tylko i wyłącznik znacznik p z tekstem, wraz z odziedziczonymi stylami (lokalnymi również).

działa, tylko czemu informacja wyświetla się tylko w jednym ostatnim przypadku?

https://jsfiddle.net/hcq25nwh/24/